扩展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 圆角div的实现代码
Oct 15 Javascript
javascript中call和apply方法浅谈
Sep 27 Javascript
使用JavaScript实现Java的List功能(实例讲解)
Nov 07 Javascript
使用js写的一个简易的投票
Nov 27 Javascript
JavaScript弹出窗口方法汇总
Aug 12 Javascript
5个最顶级jQuery图表类库插件【jquery插件库】
May 05 Javascript
详解AngularJS验证、过滤器、指令
Jan 04 Javascript
Vuex 使用 v-model 配合 state的方法
Nov 13 Javascript
vue中实现上传文件给后台实例详解
Aug 22 Javascript
微信小程序调用wx.getImageInfo遇到的坑解决
May 31 Javascript
基于 Vue 的 Electron 项目搭建过程图文详解
Jul 22 Javascript
浅谈Web Storage API的使用
Jun 23 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
php str_replace的替换漏洞
2008/03/15 PHP
PHP无敌近乎加密方式!
2010/07/17 PHP
PHP程序开发范例学习之表单 获取文本框的值
2011/08/08 PHP
Yii框架的redis命令使用方法简单示例
2019/10/15 PHP
javascript获取当前ip的代码
2009/05/10 Javascript
javascript 数组排序函数sort和reverse使用介绍
2013/11/21 Javascript
AngularJS入门教程之链接与图片模板详解
2016/08/19 Javascript
JS添加或修改控件的样式(Class)实现方法
2016/10/15 Javascript
Vue自定义指令使用方法详解
2017/08/21 Javascript
nodejs中art-template模板语法的引入及冲突解决方案
2017/11/07 NodeJs
iview的table组件自带的过滤器实现
2019/07/12 Javascript
JS数组进阶示例【数组的几种函数用法】
2020/01/16 Javascript
在vue中使用Base64转码的案例
2020/08/07 Javascript
[01:07:57]DOTA2-DPC中国联赛 正赛 Ehome vs Magma BO3 第二场 1月19日
2021/03/11 DOTA
python实现的各种排序算法代码
2013/03/04 Python
python计算N天之后日期的方法
2015/03/31 Python
python中map、any、all函数用法分析
2015/04/21 Python
详解python3实现的web端json通信协议
2016/12/29 Python
python实现内存监控系统
2021/03/07 Python
Flask之flask-session的具体使用
2018/07/26 Python
python爬虫之自动登录与验证码识别
2020/06/15 Python
Python中常用的8种字符串操作方法
2019/05/06 Python
Django框架orM与自定义SQL语句混合事务控制操作
2019/06/27 Python
keras Lambda自定义层实现数据的切片方式,Lambda传参数
2020/06/11 Python
英国工具中心:UK Tool Centre
2017/07/10 全球购物
菲律宾酒店预订网站:Hotels.com菲律宾
2017/07/12 全球购物
经济实惠的豪华家具:My-Furniture
2019/03/12 全球购物
波兰最早的运动鞋精品店之一:Street Supply
2019/08/29 全球购物
RIP版本1跟版本2的区别
2013/12/30 面试题
委托公证书范本
2014/04/03 职场文书
公司领导班子对照检查存在问题整改措施
2014/10/02 职场文书
期中考试复习计划
2015/01/19 职场文书
天鹅湖观后感
2015/06/09 职场文书
导游词之上海东方明珠塔
2019/09/25 职场文书
Python 读写 Matlab Mat 格式数据的操作
2021/05/19 Python
MySQL的表级锁,行级锁,排它锁和共享锁
2022/07/15 MySQL