如何將僅使用jQuery的事件處理程序附加到新添加的元素？

Question

有些事物我附加了一些事件。 經過一段時間後，我創建了更多這些項目，並且我希望它們也可以附加到相同的事件中。

如果使用jQuery選擇器選擇元素並將處理程序附加到事件，那麼較早的對象將具有多次附加到其事件的相同處理程序。

這樣做的正確方法是什麼？

Answer 1

我會是這樣的吧：

$(".element").unbind("click").live("click", function() { 
// ... 
}); 

和你解除綁定舊的「點擊」事件處理程序和綁定舊換新只有live一次。

Answer 2

也許你應該考慮用live來代替添加處理程序。通過這種方式，您只需聲明一次處理程序，並且它現在和將來都會對所有匹配元素保持有效。

如果由於某種原因，這是不能接受的，一個快速和骯髒的解決辦法是（例如爲click處理程序）：

$(".elements").unbind("click").bind("click", function() { 
    // ... 
}); 

更好的解決方案（同樣，沒有live）將是hasEventListener插件。閱讀文檔，或使用其sandbox on JSFiddle。

Answer 3

最簡單的方法是使用.live()來保持您的處理程序綁定到現有的以及與給定選擇器匹配的任何可能的未來元素。

Answer 4

使用一個命名空間爲您的活動，像這樣：

$('a').bind('click.customNS', function(){...})

，然後，當你創建一個新的元素，取消綁定所有的命名空間的事件，並重新綁定，就像這樣：

$('a').unbind('click.customNS'); 
$('a').bind('click.customNS', function(){...}); 

或者，使用.live('click', function(){..});，它會自動將事件綁定到任何新創建的元素，匹配您的jQuery選擇器。但是，這對於不符合CSS的選擇器不起作用。 （jQuery的特殊家長選擇，例如）