您的位置:首页 > Web前端 > JQuery

Jquery实现点击子元素标签只触发子元素点击事件,不触发父元素点击事件

2017-06-07 09:59 656 查看
      最近写代码遇到一个细节的小问题,点击子元素标签不仅触发了子元素点击事件,还会执行父元素点击事件,例如:<li>
<a>
子元素
</a>
<i tabclose="11" >
子元素
</i>
</li>为li标签和i标签都添加点击事件后,当我点击i标签区域,li标签的点击事件也会触发,后来经过查询文档发现,避免这个问题只需要为i标签的点击事件上加上jquery防止事件冒泡即可,如下:
$("i").on("click", "[tabclose]", function(e) {
e.stopPropagation();//防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数。
var id = $(this).attr("tabclose");
...
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息