處理未被其他元素處理的Javascript事件

Question

我正在編寫一個腳本，我只想處理鼠標事件，只要它們沒有被任何其他元素處理過。

我可以將一個事件偵聽器附加到文檔對象，但它將接收所有事件，而不管它們是否已被處理。

我無法控制HTML頁面中的元素，因此無法在處理事件時手動停止傳播（）。

任何想法？

Answer 1

從這篇文章here。

它似乎還沒有做到這一點。

哪些事件處理程序被註冊？

當前實現W3C的事件註冊 模型的一個問題是，您無法確定是否有任何事件處理程序已經註冊到元素中了 。在傳統模式中，你可以這樣做：

alert(element.onclick)

，你會看到其註冊到 ，或者不確定如果沒有被註冊的功能。只有在其最近才DOM 3級事件W3C增加了一個

eventListenerList

存儲事件當前註冊的元素 處理程序的列表。 這 功能尚未支持任何瀏覽器，這太新了。 但是，問題已得到解決。

幸運

removeEventListener() 

，如果你要刪除的事件 監聽器還沒有被添加到元素，所以當 疑問，你可以隨時使用removeEventListener不給任何錯誤（ ）。

Answer 2

所以，你可以在某些情況下完成你想要的東西。特別是，如果

• 您可以加載自己的自定義JavaScript之前的原始
• 你知道你正在聽的元素爲別人扔在

有效的活動，你要做的就是替換原來的目標元素上的addEventListener方法使用自定義攔截調用的方法，執行一些特殊處理，然後讓其按正常方式繼續。這個「特殊處理」是一個新的函數，它包裝了原始的回調函數，並用一些狀態標記事件參數，讓你知道別人已經處理了事件。這裏是概念證明（有jsFiddle）

目標HTML：

<div id='asdf'>asdf</div>​ 

的JavaScript：

var target = document.getElementById('asdf'); 
var original = target.addEventListener; 

var updated = function(){ 
    // Grab the original callback, so we can use it in our wrapper 
    var originalFunc = arguments[1]; 

    // Create new function for the callback, that lets us set a state letting us know it has been handled by someone 
    // Finish the callback by executing the original callback 
    var newFunc = function(e){ 
     console.log('haha, intercepted you'); 
     e.intercepted = true; 
     originalFunc.call(this, e); 
    }; 

    // Set the new function in place in the original arguments 'array' 
    arguments[1] = newFunc; 

    // Perform the standard addEventListener logic with our new wrapper function 
    original.apply(this, arguments); 
}; 

// Set the addEventListener on our target to our modified version 
target.addEventListener = updated; 

// Standard event handling 
target.addEventListener('click', function(e){ 
    console.log('original click'); 
    console.log('intercepted?', e.intercepted); 
})