jQuery:事件冒泡以及如何“单击”、"live.click“、"stopPropagation”和“返回假”一起工作
我会在这里看到情侣的场景。请帮帮我
下面是基本情况：http://jsfiddle.net/2zsLy/9/
当我单击Click Me时，警报框和Another Paragraph都会出现。这是预期的，因为单击事件气泡一直到父容器，即body。现在开始我的问题
1) http://jsfiddle.net/2zsLy/10/
为什么将return false添加到我的live.click中并不能阻止单击事件的冒泡。从示例中，live.click冒泡并触发警报框。我以为文件上说，返回假将阻止实时事件的泡沫。
2) http://jsfiddle.net/2zsLy/11/
现在，我将body中的单击事件更改为live.click，它修复了问题-> --单击事件没有冒泡(因此没有显示警告框)。为什么live.click工作，而click不工作。
3) http://jsfiddle.net/2zsLy/13/
我认为文档清楚地指出，调用event.stopPropagation()并不能阻止冒泡的发生，我只是这样做了。我使用event.stopPropagation()，希望它仍然会触发我的警告框，但它不会。为什么？
注意：关于前两个问题的答案，请参见justkt答案。关于最后一个问题的答案，请参见Squeegy see和his reply。
回答 2
Stack Overflow用户
发布于 2011-05-03 17:46:09
您的问题的答案可以在event.stopPropagation()文档中找到。
关于生活(“点击”)与“点击”和“冒泡”：
由于.live()方法一旦将事件传播到文档顶部，就会处理这些事件，因此不可能停止活动事件的传播。类似地，.delegate()处理的事件总是传播到它们被委派到的元素；在调用委托事件处理程序时，它下面的任何元素上的事件处理程序都已经被执行了。
所以你看到的是预期的行为。生活(“点击”)不会停止冒泡。现在首选的.delegate()也是如此。
这个答案广泛地描述了在使用.live时停止推进的问题。还请参阅.live()文档：
事件一直持续到树的根部，这是.live()默认绑定其特殊处理程序的地方。
- 在DOM 1.4中，事件冒泡可以选择在DOM元素“上下文”处停止。
关于stopPropagation本身：
关闭单击事件上的冒泡。
因此，stopPropagation()应该在返回false的地方防止冒泡；will，虽然不会阻止冒泡的地方，但阻止冒泡的是preventDefault()。return false;实际上是stopPropagation()和preventDefault()。
作为对每个弹琴例子的回应。
1) http://jsfiddle.net/2zsLy/10/
return false;不会阻止使用live或delegate绑定的事件冒泡。文档明确地说明了所有冒泡的情况，无论是用return false;还是用stopPropagation()完成。所以发生的是
- 点击
<p> - 单击
<body>中的气泡，触发body.click() - 单击气泡以记录根，在其中它与
$(event.target).closest('p');匹配，从而调用live('click') - 返回false发生，但在步骤2中调用了主体处理程序。
2) http://jsfiddle.net/2zsLy/11/
在这种情况下，事件会到达相同的位置(文档根)，返回false将停止通过主体上的live向进一步的事件绑定的传播。
- 点击
<p> - 单击
<body>中的气泡，但由于主体的处理程序是通过live附加的，所以尚未调用 - 单击气泡以记录根，在其中它与
$(event.target).closest('p');匹配，从而调用live('click') - 返回假发生
- 由于返回false发生，在主体上不调用
live('click')。
3) http://jsfiddle.net/2zsLy/13/
stopPropagation()显式地用于防止冒泡，尽管它具有return false;所做的相同限制-因此，如果有通过bind绑定的单击处理程序，则不会在live('click')事件中防止冒泡。
Stack Overflow用户
发布于 2011-05-03 17:54:12
- 活动事件总是在绑定事件之后发生(比如调用
click(fn))。所以返回false在这里什么都不做，因为$("body").click()已经发生了。这是泡泡造成的。单击发生在您单击的元素的每个父元素上，触发每个单击事件。只有当弹出到根文档时，它才会触发任何活动事件。 - 在本例中，您有两个活动事件。因此，事件会一直弹出到文档中，jQuery将开始运行它发现的与单击相匹配的任何活动事件。当它获得一个
return false时，它将停止运行任何其他的实时事件。现场直播活动先宣布，然后再运行。因此，您将得到新的段落，但在p活动单击之后，警报被添加到活动事件堆栈之后，就没有其他内容了。 - 对于绑定事件，它不会停止传播，但是
event参数实际上是一个jQuery事件包装器对象，我相信它了解live。因此，它具有与返回false类似的效果，它阻止文档单击处理程序执行任何其他活动事件。
https://stackoverflow.com/questions/5873221
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号