Question

我正在创建一个嵌套的div，如下面的代码

<body>
  <div style='border:solid 1px red' onclick='alert("hi")'>
  Hawaii
    <div style='border:solid 1px blue;margin:10px;' onclick="alert('haha');return false;">Aloha</div>
  </div>
</body>

我想展示哈哈，当点击aloha div而不是点击夏威夷div onclick事件时，有没有办法实现它？

编辑：我忘了提到我知道事件冒泡，但有没有办法阻止冒泡/取消单个元素的传播？

Answer 1

event.stopPropagation在现代浏览器中执行此操作。

在版本9之前的Internet Explorer中，您需要设置event.cancelBubble = true。

示例：

<div style='border:solid 1px blue;margin:10px;' onclick="alert('haha'); event.stopPropagation(); return false;">Aloha</div>

如果您避免将Javascript放在HTML属性中，您可以做得更好。

Immune / Unclikable嵌套div

1 个答案: