当前位置:Gxlcms > JavaScript > JavaScript和JQuery的鼠标mouse事件冒泡处理_javascript技巧

JavaScript和JQuery的鼠标mouse事件冒泡处理_javascript技巧

时间:2021-07-01 10:21:17 帮助过:3人阅读

简单的鼠标移动事件:

进入

代码如下:

mouseenter:不冒泡
mouseover: 冒泡

不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件
只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件

移出

代码如下:

mouseleave: 不冒泡
mouseout:冒泡

不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件
只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件

我们通过一个案例观察下问题:

给一个嵌套的层级绑定mouseout事件,会发现mouseout事件与想象的不一样

代码如下:

外部子元素

内部子元素

0


0