如何使jQuery的`bind`或`on`事件处理程序具有幂等性

Question

有没有一种方法可以多次调用$(selector).bind('click', handler)或者$(selector).on('click', handler)，但是只有一个处理程序被附加？目前，我有多个具有不同成功回调的AJAX处理程序，每个处理程序都会重新渲染页面上的不同元素集。理想情况下，我希望将“重新附加事件”的例程重构为单个函数，而不是所有例程。我现在能想到的唯一方法是显式解除绑定，例如：

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

寻找一种自动完成类似操作的方法。

- wrschneider

Answer 1

更好的方法是将 .on 调用移动到一个容器中。如果您有一个容器，.on 会保留并应用于与您的选择器匹配的任何现有或新的子元素：

$(container-selector).on("click", "element-selector", function(event){
// do stuff
});

http://api.jquery.com/on/

Cheers.

- MisterJames

Answer 2

您可以为事件处理程序设置命名空间，然后在绑定之前确保取消绑定：

$('#something').unbind("click.some-feature").bind("click.some-feature", function() { ... });

你可以编写自己的jQuery函数来自动完成这个操作：

$.fn.schneiderBind = function(name, fn) {
  return this.unbind(name).bind(name, fn);
});

$('#something').schneiderBind("click", function() { ... });

另外，您可以使用冒泡和委托在DOM中更高的位置绑定，这一点不会受到动态更新的影响。

- Pointy

Answer 3

$(document).on("click","selector", function() {  code goes here... });

这将适用于动态添加的对象

- James Kleeh