Jquery：元素上的事件選擇器而不是其子級上的事件？

Question

我想知道這是否可能，使用 jquery 選擇器將事件綁定到元素而不是其子元素。 實際上，我有兩個 div 一個在另一個上，絕對是 position，我想在兩個 div 上檢測到相同的事件，但如果事件發生在頂部 div 的子級上則不會（我的意思是，我想檢測事件是否在頂部 div 的透明部分，就好像它發生在下部 div 上一樣）。

例如，在這里，#desktop 和 #apps 是一個在另一個上，具有相同的固定寬度和高度，我想檢測一個事件：#desktop 或 #apps，但不是 on.stuff

HTML

<div id="desktop">

</div>
<div id="apps">
    <div class="stuff">
        test
    </div>
    <div class="stuff">
        test2
    </div>
</div>

JavaScript

$("#desktop, #global:not(its_CHildren?)").mousemove(function (mouse){
    // ...
}

如果選擇器無法做到這一點，我正在考慮做這樣的事情，它的效果令人滿意：

$("#desktop, #apps").mousemove(function(mouse){
    $("#global stuff").mousemove(function() {
        return false;
    });
    // ...
});

Answer 1

處理程序僅綁定到父元素。 問題是事件從后代中冒出來，並觸發附加到父級的處理程序。

您可以測試event.target以查看它是否與this （處理程序綁定到的元素）的值相同。

$("#desktop, #apps").mousemove(function(e){
     if( e.target === this ) {
        //run your code
     }
});

示例： http://jsfiddle.net/KAJhe/ （打開控制台查看代碼何時記錄懸停元素的 ID）

現在if中的代碼只會在您沒有將鼠標移到父元素上而不是后代元素上時觸發。