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

2019-12-24,,

解决思路如下:
首先,判断事件的当前节点,也就是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;
}

您可能感兴趣的文章:

  • jQuery插件formValidator自定义函数扩展功能实例详解
  • jQuery插件kinMaxShow扩展效果用法实例
  • jquery事件机制扩展插件 jquery鼠标右键事件
  • JQuery扩展插件Validate—6 radio、checkbox、select的验证
  • JQuery扩展插件Validate—4设置错误提示的样式
  • JQuery扩展插件Validate 3通过参数设置错误信息
  • JQuery扩展插件Validate 2通过参数设置验证规则
  • JQuery扩展插件Validate 1 基本使用方法并打包下载
  • JQuery扩展插件Validate 5添加自定义验证方法
  • jQuery autocomplate 自扩展插件、自动完成示例代码
  • boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
  • jQuery插件扩展测试实例

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

下载本文的Word格式文档,以方便收藏与打印。