javascript - 仅在内部元素上调用事件监听器(Javascript)

我有一个div在另一个里面div 。两者都附加了事件监听器来在 mousedown 上运行函数 - 称它们为 outerDivFunction和innerDivFunction 。当我点击内部div时，两个函数都被调用；我希望它只调用 innerDivFunction 。

如何做到这一点？ (Vanilla 解决方案优于 jQuery。)

最佳答案

在innerDivFunction中使用事件的stopPropagation()。这可以防止当前事件在捕获和冒泡阶段进一步传播。

了解更多详情:Event Propagation

function outerDivFunction(){
  alert('Outer Div');
}

function innerDivFunction(e){
  e.stopPropagation();
  alert('Inner Div');
}

.outer{
  border: 1px solid blue;
}
.inner{
  border: 1px solid red;
  margin: 10px;
}

<div class="outer" onclick="outerDivFunction()">Outer Div
  <div class="inner" onclick="innerDivFunction(event)">Inner Div</div>
</div>

关于javascript - 仅在内部元素上调用事件监听器(Javascript)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47644329/