javascript - js嵌套元素的点击事件

Question

我有一个包含 div 项的列表。当我单击它们时，它们中的每一个都会重定向到一个页面。现在我在 div 中添加了一个按钮，我不想在单击该按钮时被重定向(即不在单击事件上执行父 div)

<div class='item' onClick="alert('div');">
... div content
    <button class='btn' onClick="alert('button');">Action</button>
</div>

上面的代码应该只在我点击按钮时提醒一次。

编辑:

我刚刚意识到我的实际问题更上一层楼:

<a href='www.google.at'>
<div class='item' onClick="alert('div');">
    <button class='btn' onClick="alert('button');event.stopPropagation();">Action</button>
</div>
</a>

我需要在单击按钮时阻止 href 重定向。有没有类似event.stopPropagation()的东西？

Answer 1

原始答案

您可以通过调用 event.stopPropagation() 来完成此操作

<div class='item' onClick="alert('div');">
    <button class='btn' onClick="alert('button');event.stopPropagation();">Action</button>
</div>

编辑答案

显然，您可以通过返回 false 来停止传播到 anchor 元素，不确定这是否是正确的方法，但它有效。

<a href='www.google.at'>
<div class='item' onClick="alert('div');">
    <button class='btn' onClick="alert('button');event.stopPropagation();return false;">Action</button>
</div>
</a>