Javascript：如何启用 stopPropagation？

Posted 2023-05-07

【中文标题】Javascript：如何启用 stopPropagation？

【英文标题】：Javascript : How to enable stopPropagation?

【发布时间】：2011-06-11 17:22:18

【问题描述】：

使用object.stopPropagation()，我可以停止事件冒泡，但如何重新启用它？

js中是否有类似object.startPropagation之类的预定义函数？

编辑：

问题是 JS 记得如果你点击“对象”而不是在我不想要它之后总是停止事件冒泡，所以我想停止它：

document.getElementById("object").onclick = function(e)
    if(e && e.stopPropagation) 
        e.stopPropagation();
     else 
          e = window.event;
          e.cancelBubble = true;
    

【问题讨论】：

您能否添加更多信息，即您想要实现的目标。如果您调用了停止，我看不出需要启动它。

我编辑了问题@GenericTypeTea

当你说“即使在我不想要它之后”，你在什么情况下不想要它？您需要设置一些变量来表示这些情况，然后在处理程序中检查该变量。如果您实际发布代码而不是选择其他解决方案，这将很有帮助。

【参考方案1】：

它根本不记得值。每次触发 onclick 时，事件 e 都是新的。问题是您总是取消事件冒泡：

if(foo) 
    e.stopPropagation();
 else 
    e.cancelBubble = true;

e.stopPropagation 是 W3C 方法 防止事件冒泡。 e.cancelBubble 是微软 防止事件冒泡的方法。

他们都是一样的。所以你每次都取消事件的冒泡。更多阅读here。

您需要更改方法，以便仅在满足您的条件时取消冒泡：

document.getElementById("object").onclick = function(e) 

    if(e && e.stopPropagation && someCriteriaToStopBubbling === true) 
    
        e.stopPropagation();
     
    else if (someCriteriaToStopBubbling === true)
    
          e = window.event;
          e.cancelBubble = true;
    

更新： 请记住，在您当前的代码中，如果浏览器支持stopPropagation，if (e && e.stopPropagation) 将始终为真。如果它进入cancelBubble 的第二个大括号，它将不会记住最后设置的值。见this fiddle。

基本上，总而言之，在您的代码中，您每次点击后都会取消传播。您必须在函数中设置一些标准来确定是否取消向上传播元素层次结构。

【讨论】：

我对其进行了测试并记得，事件气泡取消是在另一个事件触发的函数内部。当我点击另一个对象时，事件冒泡仍然被取消，我还在函数内部放置了一个警报并且可以工作，因为它记得如果你点击“对象”而不是启动函数，但我没有启动父事件冒泡函数的功能，也许我不明白，但这就是我在这里所经历的:)。但是您的解决方案是正确的，我可以在那里放一些 IF ELSE 语句，我希望它会起作用:)

@CIRK - 你做错了什么，因为它确实不记得，除非你正在做一些你提供的以外的代码。见这里：jsfiddle.net/DgwSA。每次单击该示例中的按钮时，cancelBubble 将始终为 false。我添加了一个更新，试图让你的错误更明显。

检查一下 -> jsfiddle.net/DgwSA/1 onclick 已更改，取消气泡也已更改，但是如果您警告 e.cancelbubble 会给您错误，但在我的项目中也停止了事件处理。跨度>

在我的最后一个问题中，我通过将onclick funtion 更改为其他内容解决了这个问题，但是非常感谢您的回答，您应该是对的，因为您说的很合乎逻辑，但这里出了点问题:D

@GenericTypeTea 它似乎确实记得 e.stopPropagation 设置，无论每次事件是否不同。