JavaScript和JQuery的鼠标mouse事件冒泡处理 - 网站

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

分类:JavaScript进阶教程_JavaScript技术文章 · 发布时间:2021-09-18 01:19 · 阅读:4300

这篇文章主要介绍了JavaScript和JQuery的鼠标mouse事件冒泡处理,本文总结出了mouse事件的一些定论,并分别给出了JavaScript和JQuery测试代码,需要的朋友可以参考下

简单的鼠标移动事件:

进入

复制代码 代码如下:

mouseenter:不冒泡
mouseover: 冒泡

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

移出

复制代码 代码如下:

mouseleave: 不冒泡
mouseout:冒泡

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

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

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

复制代码 代码如下:

外部子元素

内部子元素

0


   

0



标签:
JavaScript JQuery 鼠标 mouse 事件 冒泡处理

相关文章

一起来学习TypeScript的类型

这篇文章主要为大家详细介绍了TypeScript的类型,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助

JavaScript去除字符串两端空格的三种方法

本文主要介绍了JavaScript去除字符串两端空格的三种方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

html2canvas图片跨域问题图文详解

我们在进行图片保存的时候经常会发现图片跨域了,下面下面这篇文章主要给大家介绍了关于html2canvas图片跨域问题的相关资料,需要的朋友可以参考下

JavaScript中Set基本使用方法实例

因为Set中存放的数据都是不会重复的数据,我们在编写JS代码的时候,因此我们可以利用Set来帮助我们更便捷地完成许多的事,下面这篇文章主要给大家介绍了关于JavaScript中Set基本使用方法的相关资料,需要的朋友可以参考下

详解vscode中console.log的两种快速写法

这篇文章主要介绍了vscode中console.log的两种快速写法,每种方法通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

返回分类 返回首页