基于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 相关文章推荐
GWT中复制到剪贴板 js+flash实现复制 兼容性比较好
Mar 07 Javascript
从阶乘函数对比Javascript和C#的异同
May 31 Javascript
基于jquery的DIV随滚动条滚动而滚动的代码
Jul 20 Javascript
Android中资源文件(非代码部分)的使用概览
Dec 18 Javascript
JavaScript中的eval()函数详解
Aug 22 Javascript
javascript变量声明实例分析
Apr 25 Javascript
jquery带下拉菜单和焦点图代码分享
Aug 24 Javascript
jquery html5 视频播放控制代码
Nov 06 Javascript
利用nvm管理多个版本的node.js与npm详解
Nov 02 Javascript
JS 使用 window对象的print方法实现分页打印功能
May 16 Javascript
JavaScript中的回调函数实例讲解
Jan 27 Javascript
Element中Slider滑块的具体使用
Jul 29 Javascript
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初学者们头痛的十四个问题
2007/01/15 PHP
php email邮箱正则
2008/10/08 PHP
PHP中Date()时间日期函数的使用方法小结
2011/04/20 PHP
php使用imagick模块实现图片缩放、裁剪、压缩示例
2014/04/17 PHP
PHP资源管理框架Assetic简介
2014/06/12 PHP
解密ThinkPHP3.1.2版本之模块和操作映射
2014/06/19 PHP
PHP中单引号与双引号的区别分析
2014/08/19 PHP
对于Laravel 5.5核心架构的深入理解
2018/02/22 PHP
PHP如何通过带尾指针的链表实现'队列'
2020/10/22 PHP
JS中剪贴板兼容性、判断复制成功或失败
2021/03/09 Javascript
不能再简单的无闪刷新验证码原理很简单
2007/11/05 Javascript
JavaScript 应用类库代码
2008/06/02 Javascript
精通Javascript系列之Javascript基础篇
2011/06/07 Javascript
JS 表单验证大全
2011/11/23 Javascript
javascript标签在页面中的位置探讨
2013/04/11 Javascript
js点击出现悬浮窗效果不使用JQuery插件
2014/01/20 Javascript
jQuery Trim去除字符串首尾空字符的实现方法说明
2014/02/11 Javascript
node.js抓取并分析网页内容有无特殊内容的js文件
2015/11/17 Javascript
jQuery EasyUI封装简化操作
2016/09/18 Javascript
vue2.0嵌套路由实现豆瓣电影分页功能(附demo)
2017/03/13 Javascript
vue2的todolist入门小项目的详细解析
2017/05/11 Javascript
JS实现新建文件夹功能
2017/06/17 Javascript
VUE 实现滚动监听 导航栏置顶的方法
2018/09/11 Javascript
vue缓存的keepalive页面刷新数据的方法
2019/04/23 Javascript
vue调用语音播放的方法
2019/09/27 Javascript
深度解读vue-resize的具体用法
2020/07/08 Javascript
解决phantomjs截图失败,phantom.exit位置的问题
2018/05/17 Python
Python 3.8 新功能全解
2019/07/25 Python
对Pytorch神经网络初始化kaiming分布详解
2019/08/18 Python
python画环形图的方法
2020/03/25 Python
详解Python高阶函数
2020/08/15 Python
Html5之svg可缩放矢量图形_动力节点Java学院整理
2017/07/17 HTML / CSS
美国知名的女性服饰品牌:LOFT(洛芙特)
2016/08/05 全球购物
烈士陵园扫墓感想
2015/08/07 职场文书
清明节随笔
2015/08/15 职场文书
Python3中PyQt5简单实现文件打开及保存
2021/06/10 Python