作者ChinaLeng 发布于 1年前

js中有两个div,关系为父子层。

例如:

<div class="iparent">
   <div class="ichild">我想点击我,不触发上面那家伙0.0</div>
</div>

再例如存在两个点击事件:

<script>
   $(".iparent").click(function(){
      alert("我是父亲");
   });
   //子层也存在点击事件  
   $(".ichild").click(function(){
      alert("我就是我,是颜色不一样的烟火");
   }); 
</script>

这样经过测试就知道,当点击子层时,会触发父层的点击事件。

那么,怎么解决点击子层不触发父层呢?

我们可以在子层点击事件上增加一句话

e.stopPropagation();

在子节点触发事件里加上阻止冒泡(有兴趣可以研究下)

代码如下:

//子层也存在点击事件  
   $(".ichild").click(function(e){
      alert("我就是我,是颜色不一样的烟火");
      e.stopPropagation();
   });

这样当点击子元素时,不会触发父元素的点击事件了。


标签:

0条评论