Question

我有一个全局标志变量。如果此标志的值为true，那么我向DOM添加了大量<div>，否则没有任何反应。在此之后，我需要处理所有先前添加的<div>的点击事件。在创建<div>之后，我无法立即添加单击处理程序，因为它们位于代码的不同部分，但仍可访问标志变量。我以这种方式添加点击处理程序：

$('.js-click').click(function() {
   //Handle the click. 
});

如果之前添加了<div>并不重要，上面的代码在任何情况下都会起作用，但是因为我有全局标志变量，我可以在jQuery代码之前添加一个条件，所以只有在创建<div>时才会执行。

if(flag) {
   $('.js-click').click(function() {
      //Handle the click. 
   });
}

这会有什么不同吗？是否有一定数量的元素或jQuery选择，这种条件会提高效率？

Answer 1

为什么不直接使用事件冒泡而不担心何时添加？

$(document /*or a container element that holds them all*/).on("click", ".js-click", function() {
    //handle the click
});

这样做的好处是，您不会在一次又一次的情况下向多个元素添加点击事件。

Answer 2

快速回答是：如果实际的选择器执行（通常非常快）对你来说不是问题，那么就不需要进行旗标测试。

如果性能可能有问题，那么添加标记测试肯定会有所帮助（但它会增加代码的相互依赖性，所以如果你重命名标志或更改与之相关的逻辑，这段代码可能会停止工作这可以不被注意。）

Answer 3

+1为epascarello的事件冒泡解决方案。

还有一些关于JQuery性能规则的好文章我认为有用：

jQuery Performance Rules

10 Ways to Instantly Increase Your jQuery Performance

在使用jQuery选择之前，我应该检查对象是否存在？

3 个答案: