mouseover和mouseout事件在鼠标经过子元素时也会触发
JavaScript的mouseover和mouseout事件,在绑定元素内部有子元素的情况下,
经过绑定元素时会多次触发mouseover和mouseout事件。
jQuery解决办法:
jquery的mouseenter和mouseleave方法已经修复了这个问题,可以直接用来替代mouseover和mouseout
不过有个mouseenter和mouseleave有个小问题是,让鼠标从文档外直接进入绑定事件的元素时,mouseenter不生效
暂时解决办法是,别让绑定事件的元素靠浏览器边缘,尽量留出至少1px间距。
另外,jquery的hover()方法,相当于使用了mouseenter和mouseleave。也能解决mouseover和mouseout的问题。
mouseover和mouseout事件在鼠标经过子元素时也会触发的更多相关文章
- 【原创】解决鼠标经过子元素触发mouseout,mouseover事件的问题
关键词:父子元素关系 mouseout mouseover 事件 事件冒泡 初期代码: <!DOCTYPE html> <html> <head> < ...
- mouseover和mouseout事件引发的BUG-解决方法
mouseover和mouseout引发的BUG原由 当给一个元素添加mouseover或mouseout事件,这个元素还有子元素. 由于子元素的事件冒泡,鼠标移入或移出子元素都会触发事件. 解决的方 ...
- 父级元素绑定定mouseout和mouseover,移过子元素是都会触发
2019独角兽企业重金招聘Python工程师标准>>> mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件. 只有在鼠标 ...
- mouseover和mouseout事件的相关元素
在发生mouseover和mouseout事件时,还会涉及更多的元素,这两个事件都会涉及把鼠标指针从一个元素的边界之内移动到另一个元素的边界之内.对mouseover事件而言,事件的主目标获得光标元素 ...
- mouseover 和 mouseout 事件是可以冒泡的 取消
mouseover 和 mouseout 事件是可以冒泡的,子元素上触发的事件会冒泡到父元素上.可以改用 mouseleave 和 mouseenter 事件,这两个事件不冒泡.
- html 子元素和父元素都监听了 click 事件,点击子元素时为何先触发的是父元素的 click 事件?
先上一段代码,点击子元素时先触发的是父元素的 click 事件 <html> <head> <script type="text/javascript" ...
- 鼠标 mouseover和mouseout事件
在div内想实现鼠标移入移出效果,最开始的时候是用了jquery的mouseout和mouseover事件来实现的, $('.product).mouseover(function(){ …… }). ...
- jquery的鼠标移入移出事件hover、mouseenter、mouseleave、mouseover、mouseout
hover:鼠标进入元素的子元素时不会触发‘鼠标移开’的事件: mouseenter.mouseleave:效果与hover相同: mouseover: 鼠标进入元素和进入它的子元素时都会触发‘mou ...
- jQuery mouseover,mouseout事件多次执行的问题处理
控制鼠标移上移下事件,在使用Jquery 的mouseover,mouseout事件时,元素内部含有其它元素,会造成该事件多次的触发的情况. 问题解析 在用到mouseover和mouseout事件来 ...
随机推荐
- 安装windows系统(win7)
又到了清理电脑,重装系统的时候了.最近被自己电脑折腾得不清,特记录下安装心得,以方便以后. 分区考虑(35G+40G) 35G=16G+4G+5G+10G,其中16G是64位官方旗舰版WIN7刚安装好 ...
- ganglia 无数据问题解决
用ambari安装了HDP版本的hadoop,dashboard中ganglia的CPU.内存.网络等监控没有数据,找了很多原因,最后发现是因为rrdcache的时间问题导致的. gmetad的deb ...
- Java学习感受
一个暑假,两本书,让我了解到了Java的神奇美妙,这个工具的年龄跟我一样大,然而日久弥新,随着电脑技术科学家,工程师的开发,Java的功能越来越完善.学习的时间不长,但我比较着学习,把Java跟C.C ...
- Python数据类型转换
Python数据类型之间的转换 函数 描述 int(x [,base]) 将x转换为一个整数 long(x [,base] ) 将x转换为一个长整数 float(x) 将x转换到一个浮点数 compl ...
- UIwebView实现html的离线缓存
1.html的缓存主要採取ASIHTTPRequest的缓存策略 (1).设置缓存策略 //设置缓存 ASIDownloadCache *cache=[[ASIDownloadCache alloc] ...
- 怎样在win7下装ubuntu(硬盘版安装)
1)首先还是分区,在计算机上右键--管理--磁盘管理 装Ubuntu分配的硬盘大小最好是(20G以上)不要太小,这里请注意,ubuntu和windows文件系统全然不同,所以我们划好要给ubuntu的 ...
- keepalive support-----Programming applications
TCP Keepalive HOWTO Prev Next 4. Programming applications This section deals with programming code ...
- Java基础知识强化之网络编程笔记01:InetAddress类的概述和使用
1. InetAddress类 InetAddress是Java对IP地址的封装,在java.net中有许多类都使用到了InetAddress,包括ServerSocket,Socket,Datagr ...
- c# PadLeft,PadRight用法
补位 string str = "100"; str.PadLeft(5,'0') 输出:00100 str.PadRight(5, '0') 输出:10000
- SQL Server 游标
结果集,结果集就是select查询之后返回的所有行数据的集合. 在关系数据库中,我们对于查询的思考是面向集合的.而游标打破了这一规则,游标使得我们思考方式变为逐行进行. 正常面向集合的思维方式是: 而 ...