假设我有这个HTML:
<body>
<div id="topbar">
First block here.
<p>Another block here.</p>
</div>
<div class="header">
<div class="container"></div>
</div>
<div id="footer">Footer</div>
</body>
如何禁用bind上div#topbar？
$('body').bind('mouseover mouseout', function(event) { });
我已经尝试了这个没有成功:
if($(event.target).is('#topbar')) { //do nothing }
else { //do stuff }
实际上,我的问题是如果我在p标签上进行鼠标悬停,则代码不起作用.
PS:我对HTML没有任何控制权,所以我必须使用常见的标签body.
谢谢.
尝试为正文的其余部分创建另一个 div：
<body>
<div id="topbar">hello
<div>How<br>are<br>you<br>today<br>?</div>
</div>
<div id="mouseEvent">
<div class="header">
<div class="container"></div>
</div>
<div id="footer">Footer</div>
</div>
</body>
和js：
$('body').bind('mouseover mouseout', function(event) {
var list = $('#topbar').find( "*" );
if($(event.target).is("#topbar") || $(event.target).is(list)) {
alert("hello");
} else {
alert("footer");
}
});
更新：JSFiddle