繞過 event.stopPropagation

Question

我正在編寫一個 JavaScript 插件（不在 jQuery 中），它在某個事件被觸發時開始工作。 它在大多數網站上都可以正常工作，但我在使用stopPropagation()的網站上遇到了問題。 是否有可能繞過這個並附加事件？

Answer 1

對於符合標准的瀏覽器，請使用捕獲階段。 對於 IE，您可以通過在元素（可能是body ）上調用setCapture來捕獲鼠標事件。 完成工作后，在event對象的srcElement上調用fireEvent 。

Answer 2

stopPropagation()是如何阻礙你的？ （添加更多描述如何/關於您的附加組件的工作/附加內容）。

stopPropagation()唯一要做的就是阻止事件冒泡到接收事件的元素的父元素。 因此，不會調用父級上的事件處理程序。 但是直接在元素上的同一事件的多個處理程序都會被調用。

所以...只要您將事件處理程序直接綁定到首先生成事件的元素，就可以了。 如果您只是嘗試偵聽例如body上的事件並依賴於冒泡的所有事件，那么您就不走運了。

例如，如果您現在單擊紅色 div，您將收到一條警報，說sibling handler和一個說inline handler ，盡管之前定義的 inline- onclick處理程序調用stopPropagation() 。

（注意：此示例不處理使用attachEvent()和cancelBubble的 IE 細節）

<style type="text/css" media="screen">
    #parent1 { background-color: green; width:300px; height:300px }
    #test { background-color: red; width:200px; height:200px }
</style>

<div id="parent1">
    <div id="test" onclick="javascript:event.stopPropagation();alert('inline handler');"></div>
</div>

<script type="text/javascript">
    parent1.addEventListener('click',
        function(e) { alert('parent'); },
        false
    );
    test.addEventListener('click',
        function(e) { alert('sibling handler'); },
        false
    );
</script>