Question

我有一个元素如下所示：

<div id="treeTable123" class="collapsed">
<div id="test"></div>
</div>

我已经使用jquery将click函数绑定到id为'test'的div。功能1：

 $(document).delegate('#test', 'click', function(e){
   ....
 });

我有另一个绑定点击功能到其他元素：函数2：

  $('[id^="treeTable"]').delegate('.collapsed', 'click', function(e){
  });

当我点击id为'test'的div时，两个事件都会被触发。所以我想在函数1中点击事件时阻止函数2中的事件。我该怎么做？

Answer 1

$('[id^="treeTable"]').delegate('.collapsed', 'click', function(e){
   if($(e.target).closest('#test').length === 0) {
      // code placed inside this condition is not executed on clicking the element #test
   }
});

Answer 2

只需在e.stopPropagation()表单中调用第一个回调即可。这是一个演示http://jsfiddle.net/eyXT7/2/。

Answer 3

您可以简单地使用e.stopPropagation()

More Info

Answer 4

如你所知，它是不可能的。如果不使用委托，则可以执行此操作，因为事件必须冒泡到要触发的事件处理程序的委托目标。因此，function2将在function1之前触发，你无法阻止它在触发后触发。

 $('#test').on('click', function(e){
     e.stopPropagation();
   ....
 });

http://jsfiddle.net/r5JaL/

在jquery中停止元素上的事件传播

4 个答案: