让jQuery忽略事件中的子项
提问于 2013-03-18 14:24:58
如果我有以下标记：
<ul id="level1">
<li>
<a href="#">Test</a>
<ul id="level2">
<li>
<a href="#">Test</a>
</li>
</ul>
</li>
</ul>基本上，如果我悬停在level 1上，我需要它来做一些事情。但是，当我将鼠标悬停在level2上时，它会触发它，因为它在level1中。有没有办法让它只在我将鼠标悬停在level1上时才会发生。
举个例子来说明我的意思：
左边的长方体是右边长方体的父对象。但是我需要的是当鼠标悬停在左边的框(父框)而不是右边的框(子框)时发生的事情。
谢谢。
如果我没有很好地解释我的问题，我很抱歉。
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-03-18 14:28:05
一种解决方案是对子对象调用event.stopPropagation：
$("#parent").on("someevent", function(){
// do stuff
});
$("#child").on("someevent", function(e){
e.stopPropagation(); // prevent the event from bubbling to the parent.
});Stack Overflow用户
发布于 2013-03-18 14:28:37
http://api.jquery.com/category/event-object/
event.stopPropagation();
就是你需要的
$('#level2').hover)function(e) {
e.stopPropagation(); // stops events from triggering in children
},function (e) {}Stack Overflow用户
发布于 2013-03-18 14:55:56
$('level1').hover(function(){ if(!IsMouseOver($(this).find(level2)){ do what you want it to do }; });
我还没有测试过它，但是你明白其中的逻辑了。鼠标是否在level1上？是。如果结束了level1还没有结束level2照我说的做
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15479171
复制相关文章
腾讯云开发者
