如何禁用 div 上的绑定

Question

假设我有这个 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>

如何禁用 div#topbar 上的 bind？

$('body').bind('mouseover mouseout', function(event) { });

我已经试过了，但没有成功：

if($(event.target).is('#topbar')) { //do nothing }
else { //do stuff }

实际上，我的问题是，如果我将鼠标悬停在 p 标签上，代码将不起作用。

PS: 我对 HTML 没有任何控制，所以我必须使用像 body.[=18 这样的普通标签=]

谢谢。

Answer 1

尝试为 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

如何禁用 div 上的绑定

How can I disable a bind on a div

jquery

bind