如何防止重疊元素冒泡事件？

我需要一條線索，當我將鼠標指針移動到它上面時，如何停止＃泡沫閃爍，這兩個元素相互放置在一起，canvas上的onMouseMove顯然會干擾它，我使用Chrome進行測試。如何防止重疊元素冒泡事件？

<p id="bubble" onclick="noBubble();"></p> 
<canvas id="kogal" width="450" height="630" onmousedown="onMouseDownkogal(this, event);" onmousemove="onMouseMoveKogal(this, event);" onmouseup="onMouseUpKogal();" onmouseout="onMouseOutKogal();">

只有當鼠標指針在#bubble上方時，纔可以停止canvas的onMouseMove？我已經嘗試preventDefault並返回false在幾個組合無濟於事，謝謝你的任何提示。^_^

來源

2014-10-31 usagi

由於元件是兄弟姐妹，所述'p'元件上的事件不所述'canvas'元件，反之亦然上觸發的事件。如果你在'p'元素上，'mousemove'不應該在'canvas'元素上被觸發。證明：http://jsfiddle.net/2z2rbzzj/。或者'p'元素不在'canvas'之上？ – 2014-10-31 15:05:39

我不qiet相信如果我理解你的問題，但通常你可以通過寫入「返回false」阻止bubbeling效果，或者如果您使用jquery：event.stopPropagation（） – ThunD3eR 2014-10-31 15:45:29

event.preventDefault()只是防止發生默認的事件行爲，比如您在提交表單時重新加載頁面。你想要的是event.stopPropagation()，這將防止事件冒泡到容器元素。

https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Examples#Example_5:_Event_Propagation

來源

2014-10-31 15:48:07

如何防止重疊元素冒泡事件？

回答

相關問題