码迷,mamicode.com
首页 > Web开发 > 详细

js中事件冒泡和事件捕获

时间:2017-02-18 21:27:18      阅读:244      评论:0      收藏:0      [点我收藏+]

标签:on()   stop   rip   image   http   多个   top   name   listen   

什么时候存在这种问题?
当一个行为触发了多个对象的事件时。
 
技术分享
技术分享
<body>
  <div class="fa">
    <div class="son1">
      <div class="son2"></div>
    </div>
  </div>
  <script type="text/javascript">
    var fa = document.getElementsByClassName(‘fa‘)[0];
    var son1 = document.getElementsByClassName(‘son1‘)[0];
    var son2 = document.getElementsByClassName(‘son2‘)[0];
    fa.addEventListener("click",function(e){console.log(‘fa‘);e.stopPropagation();},true);
    son1.addEventListener(‘click‘,function(){console.log(‘son1‘)},false);
    son2.addEventListener(‘click‘,function(){console.log(‘son2‘)},true);
  </script>
addEventListener第三个参数不写时默认为false,true代表在事件捕获阶段执行,false代表在事件冒泡阶段执行。
e.stopPropagation()可以让一个行为只执行一个对象的事件。

js中事件冒泡和事件捕获

标签:on()   stop   rip   image   http   多个   top   name   listen   

原文地址:http://www.cnblogs.com/liuluteresa/p/6413980.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!