扩展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库 开发规则
Jan 31 Javascript
jQery使网页在显示器上居中显示适用于任何分辨率
Jun 09 Javascript
js用typeof方法判断undefined类型
Jul 15 Javascript
JavaScript中标识符提升问题
Jun 11 Javascript
网页收藏夹显示ICO图标(代码少)
Aug 04 Javascript
Angular实现类似博客评论的递归显示及获取回复评论的数据
Nov 06 Javascript
Vue进度条progressbar组件功能
Apr 17 Javascript
用图片替换checkbox原始样式并实现同样的功能
Nov 15 Javascript
详解微信小程序缓存--缓存时效性
May 02 Javascript
详解mpvue开发微信小程序基础知识
Sep 23 Javascript
Vue使用虚拟dom进行渲染view的方法
Dec 26 Javascript
javascript实现移动端上传图片功能
Aug 18 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
第1次亲密接触PHP5(1)
2006/10/09 PHP
图书管理程序(二)
2006/10/09 PHP
Apache启动报错No space left on device: AH00023该怎么解决
2015/10/16 PHP
CL vs ForZe BO5 第四场 2.13
2021/03/10 DOTA
抽出www.templatemonster.com的鼠标悬停加载大图模板的代码
2007/07/11 Javascript
myEvent.js javascript跨浏览器事件框架
2011/10/24 Javascript
jquery js 获取时间差、时间格式具体代码
2013/06/05 Javascript
JS实现局部选择打印和局部不选择打印
2014/04/03 Javascript
JavaScript插件化开发教程 (四)
2015/01/27 Javascript
实例解析jQuery中proxy()函数的用法
2016/05/24 Javascript
JavaScript如何实现跨域请求
2016/08/05 Javascript
NodeJs的优势和适合开发的程序
2016/08/14 NodeJs
js严格模式总结(分享)
2016/08/22 Javascript
Vue.js中数组变动的检测详解
2016/10/12 Javascript
利用jquery实现下拉框的禁用与启用
2016/12/07 Javascript
通过jsonp获取json数据实现AJAX跨域请求
2017/01/22 Javascript
nodejs根据ip数组在百度地图中进行定位
2017/03/06 NodeJs
Node.Js中实现端口重用原理详解
2018/05/03 Javascript
小程序点赞收藏功能的实现代码示例
2018/09/07 Javascript
详解Vue2 添加对scss的支持
2019/01/02 Javascript
JavaScript实现表单验证功能
2020/12/09 Javascript
[06:21]2014DOTA2国际邀请赛 庆祝VG首阶段领跑;B叔为挣牛排半夜整理情报
2014/07/13 DOTA
Python ORM框架SQLAlchemy学习笔记之关系映射实例
2014/06/10 Python
使用Python操作MySQL的一些基本方法
2015/08/16 Python
python绘制直线的方法
2018/06/30 Python
Python字符串通过'+'和join函数拼接新字符串的性能测试比较
2019/03/05 Python
Python 控制终端输出文字的实例
2019/07/12 Python
在keras里面实现计算f1-score的代码
2020/06/15 Python
自我评价正确写法范文
2013/12/10 职场文书
采购主管的岗位职责
2013/12/17 职场文书
做一个有道德的人演讲稿
2014/05/14 职场文书
工商管理本科生求职信
2014/07/13 职场文书
幼儿园小班个人工作总结
2015/02/12 职场文书
2015年信息中心工作总结
2015/05/25 职场文书
JS + HTML 罗盘式时钟的实现
2021/05/21 Javascript
使用Python+OpenCV进行卡类型及16位卡号数字的OCR功能
2021/08/30 Python