当您将鼠标悬停在以下网站上的某个图片上时,会显示一个div,其中包含操作按钮。单击div时,弹出窗口打开,当您单击子操作按钮时,将发生另一个事件。
当您点击其中一个div的子按钮时弹出窗口。我试图使用下面的代码停止事件传播。
http://penguinenglishlibrary.tumblr.com/
$(document).on('click', '#DOMWindow .like', function(event) {
event.preventDefault();
event.stopPropagation();
});
答案 0 :(得分:3)
您无法停止传播,因为该事件已委派。你真的需要代表团,即绑定时是否已经存在#DOMWindow .like
?万一它,你可以这样做:
$('#DOMWindow .like').on('click', function(event) {
event.preventDefault();
event.stopPropagation();
});
或者,正如我后来在评论中所说:
如果你真的需要委托,你可以将你的处理程序逻辑包装在if if中,检查event.target是否为#DOMWindow .like
。如果是,让处理程序完成它的工作,否则就意味着它冒泡了,所以什么都不做。
答案 1 :(得分:1)
也许
jQuery('#DOMWindow .like').unbind('mouseenter mouseleave');
假设您在jQuery上附加了一个事件(.selector')。hover()它可能会起作用
答案 2 :(得分:0)
您无法以绑定事件的方式停止传播。它与document
绑定。一旦事件发生document
,它就会冒泡到顶部,因此无法停止,因为它已经传播。
尝试将事件绑定到更接近.like
的父元素,例如#DOMWindow
。注意:绑定事件的元素在调用时必须位于DOM中(并保留在DOM中)。
$('#DOMWindow').on('click', '.like', function(event) {
event.preventDefault();
event.stopPropagation();
});
看看我做的这个例子:http://jsfiddle.net/QAZ3v/它应该告诉你我的意思。
答案 3 :(得分:0)
根据jQuery中on()函数的文档,
默认情况下,大多数事件从原始事件目标冒泡到文档元素。在整个过程中的每个元素,jQuery调用已附加的任何匹配的事件处理程序。处理程序可以通过调用event.stopPropagation()来防止事件在文档树中进一步冒泡(从而防止这些元素上的处理程序运行)。然而,附加在当前元素上的任何其他处理程序都将运行。为防止这种情况,请调用event.stopImmediatePropagation()。 (绑定到元素的事件处理程序的调用顺序与它们绑定的顺序相同。)
所以看来
event.stopImmediatePropagation();
正是您要找的。返回false可能也有效,但我不太确定。
编辑:在小提琴中测试我的两个建议后,似乎既不适用于点击处理程序。我有兴趣知道他们是否适用于on()。