如何停止一个html元素可以收听的所有事件？

Question

假设有div块，该块内有许多元素，它们将引发许多事件。 我不希望这些事件继续冒泡，否则div块之外的侦听器可能会处理具有相同名称的错误事件。 我可以在不听大量事件并一一停止的情况下做到这一点吗？

Answer 1

您必须分别监听每个事件，并使用e.stopPropagation()停止传播，其中e是事件对象。 无法同时收听每个事件，除非您有非常特定的事件子集，否则我不会采用这种方法。

正确处理冒泡事件的最常见方法是验证目标元素（ e.target ）并相应地忽略。

例如，您可以检查e.target === e.currentTarget以了解事件是否来自孩子。

 var logEl = document.getElementById('log'); document.getElementById('parent').addEventListener('click', function (e) { log('event comes from child? ' + (e.target !== e.currentTarget)); }); function log(msg) { logEl.appendChild(document.createElement('br')); logEl.appendChild(document.createTextNode(msg)); } 

 #parent, #parent > div { padding: 20px; border: 1px solid red; } #parent { height: 100px; width: 200px; } 

 Click inside the boxes <div id="parent"> parent <div>child</div> </div> <div id="log"></div>