扩展Jquery插件处理mouseover时内部有子元素时发生样式闪烁


Posted in Javascript onDecember 08, 2011

解决思路如下:
首先,判断事件的当前节点,也就是jquery的currentTarget是否在target的包含中,即下面的扩展$.containsNode。
然后,在调用hover的时候的mouseover和mouseout事件里判断currentTarget是否在target的包含中,即$.fn.fhover扩展
下面就是相关代码:

$.containsNode = function(parentNode, childNode) { 
if (parentNode.contains) { 
return parentNode != childNode && parentNode.contains(childNode); 
} else { 
return !!(parentNode.compareDocumentPosition(childNode) & 16); 
} 
} 
$.fn.fhover = function(over, out) { 
this.hover(function(e) { 
if ($.containsNode(e.target, e.currentTarget)) { 
return; 
} 
over.call(this, e); 
}, function(e) { 
if ($.containsNode(e.target, e.currentTarget)) { 
return; 
} 
out.call(this, e); 
}); 
return this; 
}
Javascript 相关文章推荐
几款极品的javascript压缩混淆工具
May 16 Javascript
JavaScript 字符串乘法
Aug 20 Javascript
那些年,我还在学习jquery 学习笔记
Mar 05 Javascript
js数组去重的方法汇总
Jul 29 Javascript
jQuery prototype冲突的2种解决方法(附demo示例下载)
Jan 21 Javascript
jQuery实现验证年龄简单思路
Feb 24 Javascript
EasyUi中的Combogrid 实现分页和动态搜索远程数据
Apr 01 Javascript
超全面的vue.js使用总结
Feb 12 Javascript
js代码延迟一定时间后执行一个函数的实例
Feb 15 Javascript
AngularJS constant和value区别详解
Feb 28 Javascript
JS 插件dropload下拉刷新、上拉加载使用小结
Apr 13 Javascript
原生JavaScript实现remove()和recover()功能示例
Jul 24 Javascript
js中document.getElementByid、document.all和document.layers区分介绍
Dec 08 #Javascript
基于jquery的代码显示区域自动拉长效果
Dec 07 #Javascript
5个javascript的数字格式化函数分享
Dec 07 #Javascript
TimergliderJS 一个基于jQuery的时间轴插件
Dec 07 #Javascript
autoPlay 基于jquery的图片自动播放效果
Dec 07 #Javascript
浅析Prototype的模板类 Template
Dec 07 #Javascript
js 幻灯片的实现
Dec 06 #Javascript
You might like
dede3.1分页文字采集过滤规则详说(图文教程)续二
2007/04/03 PHP
过滤掉PHP数组中的重复值的实现代码
2011/07/17 PHP
编译PHP报错configure error Cannot find libmysqlclient under usr的解决方法
2014/06/27 PHP
PHP魔术方法__GET、__SET使用实例
2014/11/25 PHP
php使用for语句输出三角形的方法
2015/06/09 PHP
thinkphp微信开之安全模式消息加密解密不成功的解决办法
2015/12/02 PHP
WordPress中注册菜单与调用菜单的方法详解
2015/12/18 PHP
laravel ORM 只开启created_at的几种方法总结
2018/01/29 PHP
PHP观察者模式示例【Laravel框架中有用到】
2018/06/15 PHP
Yii框架多语言站点配置方法分析【中文/英文切换站点】
2020/04/07 PHP
如何使用JS获取IE上传文件路径(IE7,8)
2013/07/08 Javascript
不使用浏览器运行javascript代码的方法
2013/07/24 Javascript
理解和运用JavaScript的闭包机制
2015/08/13 Javascript
详解JavaScript的变量和数据类型
2015/11/27 Javascript
不用一句js代码初始化组件
2016/01/27 Javascript
两种方法解决javascript url post 特殊字符转义 + & #
2016/04/13 Javascript
AngularJS实现用户登录状态判断的方法(Model添加拦截过滤器,路由增加限制)
2016/12/12 Javascript
js实现简单的二级联动效果
2017/03/09 Javascript
windows下vue.js开发环境搭建教程
2017/03/20 Javascript
详解vue-cli项目中用json-sever搭建mock服务器
2017/11/02 Javascript
微信小程序图片选择区域裁剪实现方法
2017/12/02 Javascript
微信小程序实现图片滚动效果示例
2018/12/05 Javascript
bootstrap datepicker的基本使用教程
2019/07/09 Javascript
详解Django缓存处理中Vary头部的使用
2015/07/24 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
Python 利用高德地图api实现经纬度与地址的批量转换
2019/08/14 Python
Python 单例设计模式用法实例分析
2019/09/23 Python
python 利用openpyxl读取Excel表格中指定的行或列教程
2021/02/06 Python
Python实现Excel自动分组合并单元格
2021/02/22 Python
教师自荐书
2013/10/08 职场文书
技术总监的工作职责
2013/11/13 职场文书
开工典礼策划方案
2014/05/23 职场文书
优秀共青团员事迹材料
2014/12/25 职场文书
2016元旦主持人经典开场白台词
2015/12/03 职场文书
求职信:求职应该注意的问题
2019/04/24 职场文书
python中 Flask Web 表单的使用方法
2022/05/20 Python