基于mouseout和mouseover等类似事件的冒泡问题解决方法


Posted in Javascript onNovember 18, 2013

最近写点东西,比较闹心,一个弹出层,上边有其他元素,本意是鼠标离开弹出层时,执行一些动作,但在实际应用中,鼠标离开弹出层中的元素时,也会激活这些动作。试了各浏览器的停止事件冒泡的方法,均无效。

还是咱们javaeye里高人众多,在一个哥们博客中发现了如下代码:

  function isMouseLeaveOrEnter(e, handler) {    
        if (e.type != 'mouseout' && e.type != 'mouseover') return false;    
         var reltg = e.relatedTarget ? e.relatedTarget : e.type == 'mouseout' ? e.toElement : e.fromElement;    
         while (reltg && reltg != handler)    
            reltg = reltg.parentNode;    
         return (reltg != handler);    
     }

这个方法是判断,当前元素是不是要执行mouseout事件的元素,这样就可以避免上述问题。
Javascript 相关文章推荐
Javascript var变量隐式声明方法
Oct 19 Javascript
基于JQuery框架的AJAX实例代码
Nov 03 Javascript
js实现可折叠展开的手风琴菜单效果
Sep 07 Javascript
JS判断鼠标进入容器的方向与window.open新窗口被拦截的问题
Dec 23 Javascript
js点击任意区域弹出层消失实现代码
Dec 27 Javascript
使用jQuery的ajax方法向服务器发出get和post请求的方法
Jan 13 Javascript
详解VUE的状态控制与延时加载刷新
Mar 27 Javascript
jquery实现放大镜简洁代码(推荐)
Jun 08 jQuery
JavaScript数组去重的多种方法(四种)
Sep 19 Javascript
webpack4与babel配合使es6代码可运行于低版本浏览器的方法
Oct 12 Javascript
Echarts之悬浮框中的数据排序问题
Nov 08 Javascript
如何在vue 中引入使用jquery
Nov 10 jQuery
ExtJS自定义主题(theme)样式详解
Nov 18 #Javascript
设为首页和收藏的Javascript代码(亲测兼容IE,Firefox,chrome等浏览器)
Nov 18 #Javascript
jquery cookie的用法总结
Nov 18 #Javascript
JS JSON对象转为字符串的简单实现方法
Nov 18 #Javascript
javascript获取ckeditor编辑器的值(实现代码)
Nov 18 #Javascript
js 页面元素的几个用法总结
Nov 18 #Javascript
封装的jquery翻页滚动(示例代码)
Nov 18 #Javascript
You might like
基于PHP导出Excel的小经验 完美解决乱码问题
2013/06/10 PHP
浅谈PHP命令执行php文件需要注意的问题
2016/12/16 PHP
PHP框架Laravel中实现supervisor执行异步进程的方法
2017/06/07 PHP
jquery animate 动画效果使用说明
2009/11/04 Javascript
基于jquery的checkbox下拉框插件代码
2010/06/25 Javascript
5秒后跳转效果(setInterval/SetTimeOut)
2013/05/03 Javascript
把jquery 的dialog和ztree结合实现步骤
2013/08/02 Javascript
jQuery Mobile 导航栏代码
2013/11/01 Javascript
JavaScript中setInterval的用法总结
2013/11/20 Javascript
JQuery实现绚丽的横向下拉菜单
2013/12/19 Javascript
js实现基于正则表达式的轻量提示插件
2015/08/29 Javascript
Markdown+Bootstrap图片自适应属性详解
2016/05/21 Javascript
基于jQuery ligerUI实现分页样式
2016/09/18 Javascript
浅谈EasyUi ComBotree树修改 父节点选择的问题
2016/11/07 Javascript
JavaScript获取键盘按键的键码(参照表)
2017/01/10 Javascript
微信小程序之蓝牙的链接
2017/09/26 Javascript
JavaScript判断日期时间差的实例代码
2018/03/01 Javascript
Layui给switch添加响应事件的例子
2019/09/03 Javascript
vue-cli设置publicPath小记
2020/04/14 Javascript
Python使用django框架实现多人在线匿名聊天的小程序
2017/11/29 Python
python实现换位加密算法的示例
2018/10/14 Python
Python实现Event回调机制的方法
2019/02/13 Python
python中open函数的基本用法示例
2019/09/07 Python
python带参数打包exe及调用方式
2019/12/21 Python
python3 自动打印出最新版本执行的mysql2redis实例
2020/04/09 Python
Jupyter加载文件的实现方法
2020/04/14 Python
Python实现异步IO的示例
2020/11/05 Python
Sentry错误日志监控使用方法解析
2020/11/12 Python
python如何调用php文件中的函数详解
2020/12/29 Python
ROSEFIELD手表荷兰官方网上商店:北欧极简设计女士腕表品牌
2018/01/24 全球购物
介绍一下Java的事务处理
2012/12/07 面试题
Java面试题:请说出如下代码的输出结果
2013/04/22 面试题
小学生元旦广播稿
2014/02/21 职场文书
初中家长评语和期望
2014/12/26 职场文书
青年人初次创业的“五不要”
2019/08/23 职场文书
原生Javascript+HTML5一步步实现拖拽排序
2021/06/12 Javascript