發送數據到按鈕和php的頁面結果

Question

好的。問題是我正在一個網站上工作，您可以輕鬆地對某些圖像/視頻等進行投票或倒投。現在發生的事情是發送請求。我可以處理大多數PHP的東西等等，我也可以做數據庫請求;但是，如何向我的PHP頁面發送請求？我希望它從主頁面發送，並且不會刷新頁面。此外，我試圖將其添加到「表單」，用戶單擊該按鈕並提交，但我需要一個「id」變量添加請求。現在，我知道我需要一些jQuery和Ajax，但我沒有CLUE開始。以下是我對我的第一頁：

<form action="vote.php"> 
<input type="image" src="imgs/1.png" name="1" alt="<?php echo $sub; ?>" /> 
<input type="image" src="imgs/2.png" name="2" alt="NOT" /> 
<input type="text" value="<?php echo $id; ?>" name="id" hidden /> 
</form> 

現在，投票頁面：

<?php 

require_once('inc/dbConnect.php'); 

if (empty($id)) { 
    $error = "Which photo to vote?" 
} 

// Receive vote count, is it UP or DOWN? 
// save in variable 
// do a check and add it to database, <- I can do this part. 
?> 

Answer 1

HTML：

<form action="vote.php"> 
<button type="button" name="vote" value="up">Upvote</button> 
<button type="button" name="vote" value="down">Downvote</button> 
<input type="hidden" name="image" value="filename_or_unique_id_of_img.jpg"> 
</form> 

的jQuery：

form.find('button').on('click',function(){ 
    var form,url,data;  
     form = $('form'); 
     url = form.attr('action'); 
     data = 'voted='+$(this).val()+'&image='+image; 

    $.ajax({ 
    url:url, 
    data:data, 
    type:'POST', 
    success:function(data){ 
     alert(data) //'Thanks for voting!' 
    } 
    }) 

}) 

PHP：

$vote = $_POST['vote']; 
$image = $_POST['image']; 
//stuff with database 
echo 'Thanks for voting!';