jquery hover事件阻止冒泡示例

当前位置:

jquery hover事件阻止冒泡示例

作者:邓华锋于2018-5-21发布在 分类:jquery / 阅读162 次 / 共有0条评论  
正常情况下的hover事件写法:
 $(element).hover(function() {
	$(this).addClass(ELEMENT_HOVER);
	},
	function() {
		$(this).removeClass(ELEMENT_HOVER);
	}
);
为了阻止冒泡,既移动到此元素时,父元素不应该也有hover效果,写法如下:
 //hover 的on形式,为了阻止冒泡  阻止父元素也有hover效果
		$(element).on("mouseover mouseout", function(e) {
			var oEvent = e || event;
			oEvent.stopPropagation(); //阻止冒泡,向上hover效果
			if(oEvent.type == "mouseover") { //鼠标悬浮
				$(this).addClass(ELEMENT_HOVER);
			} else if(oEvent.type == "mouseout") { //鼠标离开 
				$(this).removeClass(ELEMENT_HOVER);
			}
		});
  • 标签: jQuery 事件 hover 阻止冒泡 示例
  • 该日志于 2018-5-21 17:58 由 邓华锋 发表在 邓华锋 上,你除了可以发表评论外,还可以转载"jquery hover事件阻止冒泡示例"日志到你的网站或博客,但是请保留源地址及作者信息,谢谢!!
  • 版权所有:《邓华锋》 => 《jquery hover事件阻止冒泡示例
    本文地址:http://dhf.me/post-327.html
    除非注明,文章均为 《邓华锋》 原创,欢迎转载!转载请注明本文地址,谢谢。