javascript - 停止 jquery 元素上的事件传播

Question

我有一个元素，如下所示:

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

我已使用 jquery 将 click 函数绑定(bind)到 ID 为“test”的 div。 功能1:

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

我还有另一个与其他元素绑定(bind)的点击函数: 功能2:

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

当我单击 ID 为“test”的 div 时，两个事件都会被触发。所以我想阻止函数 2 中单击函数 1 内的事件时发生事件。我该怎么做？

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
   }
});