避免对 DOM 事件进行双重绑定（例如使用 onclick()）答案

【问题标题】：Avoid double binding on DOM events (with onclick() for example)避免对 DOM 事件进行双重绑定（例如使用 onclick()）
【发布时间】：2012-01-14 18:19:39
【问题描述】：

我有一些 DOM 组件，我在其上绑定了 click、hover 等事件。因为我使用JSF 和AJAX，所以有时这些组件会被重新渲染，然后我必须将 DOM 事件重新绑定到它们。

为了实现新渲染组件的自动重新绑定，我注册JSF事件以这种方式重新绑定：

jsf.ajax.addOnEvent(function (data) {
    if (data.status === "success") {
        $("#someid").click(function() {...});
    }
});

这个解决方案的问题是，当组件没有重新渲染但发生AJAX事件时，绑定会增加一倍和三倍等等。

我想到的一个解决方案是为每个 DOM 组件设置一个标志，当组件绑定到事件时，该标志设置为 true。它会起作用，但有点麻烦。

我想知道是否有我不知道（或想不到）的更好的解决方案，比如某种jQuery 功能可以让程序员避免每个 DOM 组件的每个事件有多个绑定。

谢谢！

【问题讨论】：

【解决方案1】：

这正是jQuery.live() 的用途。

编辑：如 cmets 中所述，从 jQuery 1.7 开始，正确的使用方法是 jQuery.on()

【讨论】：

如果你使用 jQuery >= 1.7 你想使用 .one()
@pna - one() 在触发第一个事件后自动执行unbind()。这与OP所询问的内容无关。 OP 需要.live() 或.on()，所以新添加的元素只有一个事件绑定，无需手动绑定。