如何在兒童停止傳播時聆聽兒童事件

我需要在Document級別觀看兒童事件，但是如果兒童使用方法stopPropagation()停止傳播，我無法聽到兒童發生的這些事件。如何在兒童停止傳播時聆聽兒童事件

有人可以知道更好的方法來做到這一點嗎？

編輯：現在我想創建一個Chrome擴展監視DOM節點事件，但事件可以停止傳播，這是不是一個很好的做法，額外的監聽器添加到所有節點。以下示例將顯示我的問題。

客戶HTML片段

<body> 
    <input type="button" value="Click Me" id="b"> 
</body>

客戶的JavaScript

var button = document.querySelector('#b'); 
button.addEventListener('click', function(e) { 
    console.log('Button has been clicked'); 
    e.stopPropagation(); 
});

瀏覽器擴展程序內容腳本

document.addEventListener('click', function(e) { 
    console.log('Node(' + e.target.nodeName + ') has been clicked'); 
    // this listener will not be invoked because event has been stopped 
    // propagation. 
});

來源

2015-12-22 nailiebreak

當問的問題在這裏它始終是更好地描述你真正的問題，不只是你的嘗試性解決方案的問題。這可以讓人們閱讀你的問題，爲你提供你甚至沒有意識到的解決方案。當你只描述你嘗試的解決方案的問題並且沒有描述真正的問題時，除了你正在嘗試創建的解決方案之外，我們幾乎無法做到。這被稱爲[XY問題]（http://meta.stackexchange.com/questions/66377/what-is-the-xy-problem），嚴重限制了人們可以幫助你的程度。 – jfriend00

您可以使用「捕獲」在冒泡之前跟蹤事件。這篇文章中有很好的描述捕捉工作的原理（與冒泡形成對照）：Bubbling and capturing。總之，IE9之前除了IE以外的所有瀏覽器，都會將事件沿鏈發送到發生事件的葉，然後它們將事件重新啓動。正常事件偵聽只偵聽實際對象上的事件或傳播事件，但如果將第三個參數設置爲.addEventListener()爲true，那麼它也將偵聽事件沿着鏈條向下傳遞，其中document對象將在此之前看到事件FIRST冒泡甚至已經開始或被取消。

這裏的工作片斷演示：

// show output 
 
function log(x) { 
 
    var div = document.createElement("div"); 
 
    div.innerHTML = x; 
 
    document.body.appendChild(div); 
 
} 
 

 
// stop propagation on leaf click 
 
var leaf = document.getElementById("leaf"); 
 

 
leaf.addEventListener("click", function(e) { 
 
    log("leaf message - click in leaf, propagation stopped") 
 
    e.stopPropagation(); 
 
}, false); 
 

 
// capture listen 
 
document.addEventListener("click", function(e) { 
 
    if (e.target === leaf) { 
 
    \t log("document message - click in leaf"); 
 
    } 
 
}, true);

<div id="topParent"> 
 
    <div id="midParent"> 
 
    <div id="leaf"> 
 
    Click Here 
 
    </div> 
 
    </div> 
 
</div>

來源

2015-12-23 00:44:44 jfriend00

其實，現在我正在開發Chrome擴展來監視DOM事件。將事件偵聽器添加到所有DOM節點並不是一種好方法，所以我需要在高級別中添加偵聽器，例如'document'。但是，事件可能會在其自己的聽衆中停止傳播。 – nailiebreak

@nailiebreak - 您要監控哪個事件，爲什麼？ – jfriend00

我已更新我的問題。爲什麼我需要在'document'中觀看事件是因爲我不知道哪個實際的DOM節點客戶點擊或更改。 – nailiebreak

如何在兒童停止傳播時聆聽兒童事件

回答

相關問題