Question

我遇到了一个小的ajax应用程序的问题，其中动态添加/删除了很多元素。我发现我的ajax调用多次完成，因为我认为使用On（）会替换当前事件而不是仅仅添加函数。

所以我每次需要一个活动时都会开始使用off（）。这太糟糕了。我刚刚发现了stopImmediatePropagation（），它似乎具有相同的效果，但性能和可读性更好。

我看过很多教程，但是有很多旧的/被删除的东西。

我正在寻找一种方法来使用jQuery使用事件的最佳实践。感谢

Answer 1

在这种情况下，您希望使用事件委派。通常，当您在jQuery中绑定事件时，您将其绑定到特定元素，但如果您知道将在运行时（通过ajax等）添加元素，则可以使用事件委派;事件委托在触发事件时运行选择器，而不是绑定时间。

绑定事件时，只需设置选择器，例如

$(window).on('click', 'button.fun', function() {
    alert('how fun');
});

在上面的代码中，只要你点击button.fun，就会弹出一个警告，文字会有多么有趣。这些按钮可以自由添加/删除。请注意，除非您需要，否则不应直接绑定到window;容器越具体越好。

stopImmediatePropagation只是说要停止调度事件，但是，所有事件仍然受到限制，因此浪费了内存等。

Answer 2

最佳做法是为适用的所有标记定义事件，而不是其他任何标记。为此，您应该使用尽可能具体的选择器，它仍然定义事件应该处于活动状态的所有标记。如果更多标签应该共享相同的事件或相同的样式，那么它们可以有共同的CSS类。