javascript - JQuery:如何在仍然触发父 onclick 事件的同时停止子 onclick 事件

Question

我想知道如何在仍然触发父 onclick 事件的同时停止子 onclick 事件。例如以下结构:

<div id="parent">
   <div id="child1"></div>
   <div id="child2"></div>
   <div id="child3"></div>
</div>

比如我点击“child1”，“child1”的onclick事件不会被触发，但是“parent”的onclick事件仍然会被触发。

非常感谢!

Answer 1

您可以将点击 传递给父级吗？

$('.child1').click(function(e){
    e.preventDefault();
    $(this).parent('#parent').trigger('click');
});

当您点击.child1 时，它会阻止默认操作，然后触发id 为#parent 的child1 的父级的点击。

实际上 - 可能会忽略上面的内容 - 根据下面的评论，它可能会导致冒泡。您真正需要做的就是使用 e.stopPropagation();。

我创建了一个 jsfiddle展示了尽管 child1 绑定(bind)了一个点击函数，但它被忽略了，所以父点击只会被拾取。