jquery點擊綁定不起作用第二次

我有一個奇怪的行爲與a和img標籤裏面。jquery點擊綁定不起作用第二次

我有一個表是一個記錄列表的PHP頁面。在每一行的末尾，我都有一個刪除行的按鈕。

這是我的表的代碼：

<div class='edit' > 
    <a id='20' href='#' return;> 
     <img src='images/edit.png' /> 
    </a> 
</div>

的每個記錄，主表的每一行，有上面的代碼中，用不同的ID相互。

我的腳本代碼是：

$("#delete a").click(function(e) { 

e.preventDefault(); 

$('#action').val("delete"); 
$('#keyAction').val(this.id); 

$.ajax({ 
     type: "POST", 
     url: "processAttivita.php", 
     data: $("#attivita_form").serialize(), 
     error: function(msg) { 
      $("#errore").html(msg); 
     }, 
     success: function(msg) { 
      // display the errors returned by server side validation (if any) 
      ricaricaLista();     

     } 
    });  

// end click delete event 
});

第一行我嘗試刪除點擊圖像上正常工作。在第二個看來，jQuery不綁定「點擊」事件和a元素的默認href發生，由於href屬性中的「＃」保留在同一頁上。

任何想法爲什麼第二次jQuery不攔截點擊<a>元素？

來源

2013-02-07 fabribs

您是否動態添加行？ –

您正在使用ID選擇器#delete a，它只會匹配一個（通常是第一個）元素。

嘗試使用課程，例如.delete a。

你只得到一個元素的原因是因爲jQuery優化了任何以#開頭的選擇器通過document.getElementById，它只返回1個元素。

這裏有一個如何使用事件代理來實現同樣的事情爲例：

$("#tableid").click(".delete a", function(e) { 
    // your code 
});

你的HTML需要對你的表中的ID，並給class="delete"您刪除鏈接的容器。

來源

2013-02-07 23:15:26 Plynx

甚至可能是'.edit'？在OP給定的html中沒有id或class「delete」的元素。 –

@AustinMullins我假設從「每行結束時，我有一個刪除行的按鈕」，每個行上都有一個div，td或其他含有id =「delete」的內容，包含鏈接或其他內容像'刪除'。 – Plynx

更好的辦法是使用事件委派，特別是當顯示一個長的行列表時，這會導致每行至少附加兩個事件處理程序。所以，像這樣：'$（document）.on（'click'，'a.edit'，function（e）{e.preventDefault（）; .....}）;'這將捕獲所有編輯按鈕在一行中，甚至可以在通過ajax替換表格時使用（例如分頁） – thaJeztah

jquery點擊綁定不起作用第二次

回答

相關問題