如何阻止子元素触发父元素的事件

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何阻止子元素触发父元素的事件相关的知识,希望对你有一定的参考价值。

参考技术A 事件绑定捕获冒泡说种促发间应该冒泡逐层向冒泡document止IE标准游览器同阻止冒泡IEcancelBubble标准游览器stopPropagation具体说懂自百度吧
好好看看吧

如何解决鼠标移动到子元素 会触发父元素的mouseout事件

方法一. 用mouseleave/mouseenter代替mouseover/mouseout【最佳方法】

mouseover与mouseenter

mouseover  => 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。
mouseenter => 只有在鼠标指针从元素外穿入被选元素(到元素内)时,才会触发 mouseenter 事件。

mouseout与mouseleave

mouseout => 不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件。
mouseleave => 只有在鼠标指针从元素内穿出被选元素(到元素外)时,才会触发 mouseleave 事件。

方法二:利用e.stopPropagation()阻止事件进一步传播

e.stopPropagation()会终止事件在传播过程的捕获、目标处理或起泡阶段进一步传播。调用该方法后,该节点上处理该事件的处理程序将被调用,事件不再被分派到其他节点。

以上是关于如何阻止子元素触发父元素的事件的主要内容,如果未能解决你的问题,请参考以下文章

js在父元素上添加点击事件,怎么阻止子元素继承父元素的点击事件

js怎么通过阻止父元素事件和所有子元素事件

阻止事件冒泡

JS怎么实现子元素mousedown不触发父元素的click事件

阻止 Javascript 事件影响子元素

js在父元素上添加点击事件,怎么阻止子元素继承父元素的点击事件?