如何停止 JavaScript 中的事件冒泡？

Question

我在下面有这段代码，我想在点击子 div 时停止点击功能以启动，但我无法让它工作。我错过了什么？

child.addEventListener("click", function(e) {
e.stopPropagation();
});

这是CODEPEN应该使用它的地方。

Answer 1

添加

return false

到你的代码。应该可以。

Answer 2

e.preventDefault()

使用这个你将避免默认操作，例如当你点击<a>

时打开link

编辑

如果你打开代码笔，在JS末尾添加这段代码：

 document.querySelector(".application-blurb").addEventListener("click", function(e){
   e.preventDefault();
   e.stopPropagation();
   alert("You click");                                                                                 
 });

您会注意到 OP 目标已实现

Answer 3

child 是一个元素集合（数组）... 你必须遍历它：

for(var i=0; i<child.length; i++){
  child[i].addEventListener("click", function(e) {
    if(e.stopPropagation){e.stopPropagation();}else{e.cancelBubble=true;}
  }, false);
}

如何停止 JavaScript 中的事件冒泡？

How to stop event bubbling in JavaScript?

javascript

jquery

event-bubbling