Jquery將事件偵聽器添加到動態添加的元素

所以現在，我明白爲了將一個事件偵聽器附加到動態添加的元素，您必須在添加元素後重新定義偵聽器。有什麼辦法可以繞過這個，所以你不必執行一整塊額外的代碼？Jquery將事件偵聽器添加到動態添加的元素

2012-08-22 Wiz

香草JS的解決方案：http://stackoverflow.com/a/27373951/1385441 –

127

使用.on()你可以定義你的函數一次，它會執行任何動態添加的元素。

例如

$('#staticDiv').on('click', 'yourSelector', function() { 
    //do something 
});

來源

2012-08-22 01:48:21 Jack

有沒有辦法在不在原生jQuery。即我需要使用它與一個Jquery插件。 – Wiz

@Wiz：你可以綁定到任何事件 – zerkms

@zerkms嗯，我試圖用Hovercard和$（'。class'）。（'hovercard'，function（）{}）;當通常的語法是$（'。class'）。hovercard（function（）{}）; – Wiz

$(document).on('click', 'selector', handler);

凡click是一個事件的名稱，handler是事件處理程序，類似的參考函數或匿名函數function() {}

PS：如果你知道你要添加動態元素的特定節點 - 你可以指定它而不是document。

來源

2012-08-22 01:47:54 zerkms

不要使用'$（文件）'。該事件應該綁定到最近的靜態父級。 –

@Joseph Silber：我爲此添加了PS。「不要使用」太過分了。有使用它的有效案例（甚至沒有提及它在jquery文檔中指定：http://api.jquery.com/live/） – zerkms

當添加與jQuery插件調用新的元素，你可以做如下所示：

$('<div>...</div>').hoverCard(function(){...}).appendTo(...)

來源

2013-09-18 16:04:16 haotang

您要動態生成這些元素應用在頁面加載，所以任何聽者不會能得到的。我用正確的解決方案編輯了你的小提琴。基本上，jQuery通過將它附加到父元素並將其向下傳播到正確的動態創建的元素來爲將來的綁定保存事件。

$('#musics').on('change', '#want',function(e) { 
    $(this).closest('.from-group').val(($('#want').is(':checked')) ? "yes" : "no"); 
    var ans=$(this).val(); 
    console.log(($('#want').is(':checked'))); 
});

http://jsfiddle.net/swoogie/1rkhn7ek/39/

來源

2014-10-01 18:24:21

Jquery將事件偵聽器添加到動態添加的元素

回答

相關問題