jQuery的形式是

Question

我正在添加ajax這個我做的小列表的web應用程序。

我有一個PHP腳本輸出的列表中的每個項目的按鈕。我想調用ajax刪除一個項目與PHP和MySQL時刪除按鈕被點擊的項目之一。

下面是項目62的刪除按鈕。它有一個隱藏字段，其中包含數據庫中列表項的標識。當按鈕被點擊時，我想要一個jquery點擊事件被調用，它應該發送一個ajax請求，從數據庫中刪除具有該id的項目。

<form class="actions" action="index.php" method="POST"> 
<input type="hidden" name="idDel" id="62" value="62"> 
<input type="submit" class="button delete" value="X"> 
</form> 

我到目前爲止想到的jquery如下所示。當點擊一個帶有class .delete的按鈕（任何刪除按鈕）時，它需要以某種方式從隱藏字段中獲取id值。

('.delete').click(function(){ 
       //add click logic here 

       var id = $("input.delete").val(); 

    return false; 

    $.ajax({ 
     type: "POST", 
     url: "delete.php", 
     data: id, 
     success: function() { 

現在，我已經看過兩個類似的問題，並試圖解決它們，但我不能從他們身上找出代碼。

1. JQuery - which form was submitted?
2. How can I get the button that caused the submit from the form submit event?

感謝。

Answer 1

使用$(this)引用被點擊的按鈕，然後使用.prev()拿到按鈕，這是之前的元素，你在這種情況下，要輸入：

$('.delete').click(function() { 
    // Add click logic here 

    var id = $(this).prev('input').val(); 

    return false; 

    $.ajax({ 
     type: "POST", 
     url: "delete.php", 
     data: id, 
     success: function() { 

     }); 
    }); 
}); 

---

您還可以存儲在按鈕本身，這將意味着更少的HTML data-屬性ID（但你會失去形式的非JS POST-能力）：

HTML：

<form class="actions" action="index.php" method="POST"> 
    <input type="submit" class="button delete" value="X" data-id="62"> 
</form> 

的jQuery：

$('.delete').click(function() { 
    // Add click logic here 

    var id = $(this).data('id'); 

    return false; 

    $.ajax({ 
     type: "POST", 
     url: "delete.php", 
     data: id, 
     success: function() { 

     }); 
    }); 
});