Div 位于另一个 Div 内，避免点击

Question

你好，我的朋友们，这是我的问题，我有两个 div，其中一个位于另一个 div 内部，如下图所示。

<div class="button1" onclick={buttonOnePressed}>

   <div class="button2" onclick={buttonTwoPressed}">

   </div>

</div>

我想单击类为“button2”的 div 并仅调用一个函数“buttonTwoPressed”。但是当我点击div“button2”时，我不小心也调用了函数“buttonOnePressed”，所以这样就调用了两个函数，但我只希望一个。我能做什么来防止这种情况发生？感谢您的阅读

Answer 1

事件冒泡。使用.stopPropagation()阻止它移动到父级。

let buttonTwoPressed = (event) =>{
event.stopPropagation();
}