event.stopPropagation 停止实时事件的传播，尽管它不应该答案

【问题标题】：event.stopPropagation stops propagation of live events, although it should notevent.stopPropagation 停止实时事件的传播，尽管它不应该
【发布时间】：2011-10-08 13:55:05
【问题描述】：

文档说 event.stopPropagation 不应该停止实时事件的传播 (http://api.jquery.com/event.stopPropagation)。然而，它对我来说正好相反。试试这个：http://jsfiddle.net/PSYg8。单击红色 Div 应该会触发附加到 html 元素的实时事件。

【问题讨论】：

标签： javascript jquery events live

【解决方案1】：

文档告诉您的是，无法从live 处理程序调用stopPropagation。

因为 jQuery 通过侦听传播到 <html> 元素的所有事件然后查看触发元素是否与您的原始选择器匹配来实现 live 事件，因此停止从元素上的常规事件处理程序传播可以防止事件曾经到达live 处理程序。

编辑：如果您不清楚 DOM 事件和事件传播的工作原理，QuirksMode has a wonderful analysis of the capturing and bubbling models，微软在 W3C、经典和 IE 模型中有一个great page that lets you visualize how event propagation works。 p>

【讨论】：

哦，我的错.. 但是有什么办法可以做我想做的事情，即确保当用户点击页面上的任何位置时调用一个事件处理程序，无论页面中有什么大大地？这是一个弹出窗口。所以我想捕捉页面上的所有点击，如果它们的目标没有弹出框作为父级，那么我关闭弹出框。
无法保证冒泡事件的传播不会停止。即使你从不调用e.stopPropagation()，你也可能使用了一个可以调用的jQuery插件。您可以跳出 jQuery 的事件机制 （坏主意！） 并在 caputuring phase 中注册一个处理程序，但这在 IE <div>。在<div> 上注册一个简单的click 处理程序并从那里隐藏。
或者，避免重新发明轮子，使用 UI Dialog 或 SimpleModal 之类的东西。

【解决方案2】：

您正在交换物品。在.live 内，您不能使用stopPropagation。例如，这确实会生成两个警报：http://jsfiddle.net/PSYg8/1/。

$(document).ready(function(){
    $('html').live('click', function(){
        alert('html');
        event.stopPropagation();
    });

    $('div').click(function(event){
        alert('div');
    });
});

在.click (.bind) 内部，stopPropagation 可以无缝运行。它只是阻止 div 事件冒泡到 html 元素。

【讨论】：

【解决方案3】：

由于 .live() 方法会在事件传播到文档顶部后处理事件，因此无法停止实时事件的传播

意义

$('html').live('click', function(e){
    e.stopPropagation(); // does nothing
    alert('html');
});

您误解了文档。当您停止点击事件的传播时，它不会冒泡到实时事件。

【讨论】：