什么时候存在这种问题？
当一个行为触发了多个对象的事件时。
 
<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中事件冒泡和事件捕获的更多相关文章

  1. JS中绑定事件顺序（事件冒泡与事件捕获区别）

    在JS中,绑定的事件默认的执行时间是在冒泡阶段执行,而非在捕获阶段(重要),这也是为什么当父类和子类都绑定了某个事件,会先调用子类绑定的事件,后调用父类的事件.直接看下面实例 <!Doctype ...

  2. JS中的事件绑定，事件捕获，事件冒泡以及事件委托，兼容IE

    转载请注明出处:http://www.cnblogs.com/zhangmingze/p/4864367.html   ● 事件分为三个阶段:   事件捕获 -->  事件目标 -->   ...

  3. JavaScript 进阶教程一 JavaScript 中的事件流 - 事件冒泡和事件捕获

    先看下面的示例代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Jav ...

  4. JS事件（事件冒泡和事件捕获）

    事件流:描述的是在页面中接收事件的顺序 事件冒泡:由最具体的元素接收,然后逐级向上传播至最不具体的元素的节点(文档) 事件捕获:最不具体的节点先接收事件,而最具体的节点应该是最后接收事件 DOM中:用 ...

  5. js进阶 12-2 彻底弄懂JS的事件冒泡和事件捕获

    js进阶 12-2 彻底弄懂JS的事件冒泡和事件捕获 一.总结 一句话总结:他们是描述事件触发时序问题的术语.事件捕获指的是从document到触发事件的那个节点,即自上而下的去触发事件.相反的,事件 ...

  6. JS事件冒泡与事件捕获怎么理解?

    在js中存在事件冒泡与事件捕获两种概念,这两个概念都是为了解决页面中事件流(事件发生顺序)的问题. 事件冒泡(dubbed bubbling) 事件冒泡我们从字面意思理解就是当用户行为触发我们页面的定 ...

  7. javascript中的事件冒泡、事件捕获和事件执行顺序

    谈起JavaScript的 事件,事件冒泡.事件捕获.阻止默认事件这三个话题,无论是面试还是在平时的工作中,都很难避免. DOM事件标准定义了两种事件流,这两种事件流有着显著的不同并且可能对你的应用有 ...

  8. js 事件冒泡和事件捕获

    事件流:指的是网页中元素接受事件的顺序,它是一个概念,而不是具体的实际的东西 事件冒泡:指的是内层元素的事件,会触发包含着此元素的外层元素的事件,触发的顺序是:由内而外的 例如: <!DOCTY ...

  9. js高级：event，事件冒泡，事件捕获

    1.事件 浏览器客户端上客户触发的行为都称为事件 所有的事件都是天生自带的,不需要我们去绑定,只需要我们去触发. 通过 obj.事件名=function(){} 事件名:onmouseover 鼠标悬 ...

  10. 彻底弄懂JS的事件冒泡和事件捕获（不推荐阅读）

    由于搬去敌台了,好久没来博客园,今天无意中翻到有“误认子弟”的评论,这里特意做个说明. 本文中关于事件冒泡和事件捕获的描述和例子都是OK的,错就错在后面用jquery去展示了利用事件冒泡的例子有误,其 ...

随机推荐

  1. Cortex-M3 / M4 Hard Fault Handler （转载）

    转自大伟的,感谢大伟的帮助调试:http://www.cnblogs.com/shangdawei/archive/2013/04/30/3052491.html http://blog.frankv ...

  2. Java Socket实战之二：多线程通信

    转自:http://developer.51cto.com/art/201202/317544.htm 上一篇文章说到怎样写一个最简单的Java Socket通信,但是在上一篇文章中的例子有一个问题就 ...

  3. Orchard 相关

    Orchard中文网: http://www.orchardch.com/ 起飞网: http://www.qeefee.com/category/orchard

  4. springboot(九) Cache缓存和Redis缓存

    1. Cache缓存 1.1 缓存的概念&缓存注解 Cache 缓存接口,定义缓存操作.实现有:RedisCache.EhCacheCache.ConcurrentMapCache等 Cach ...

  5. centos 7更换阿里源

    转自 https://blog.csdn.net/jameshadoop/article/details/54881295 centos7 修改yum源为阿里源,某下网络下速度比较快 首先是到yum源 ...

  6. 各个nginx conf的虚拟主机的配置

    server { listen 80; server_name t-cl.orangevip.com; rewrite ^(.*)$ https://$host$1 permanent;} serve ...

  7. python爬虫之requests+selenium+BeautifulSoup

    前言: 环境配置:windows64.python3.4 requests库基本操作: 1.安装:pip install requests 2.功能:使用 requests 发送网络请求,可以实现跟浏 ...

  8. c语言程序设计案例教程（第2版）笔记（三）—变量、结构体

    零散知识点: 变量        :C语言中,每个变量必须先定义后引用.所谓变量存在是指系统为这个变量分配一块存储空间,此时对变量的操作,就是对变量所对应的存储空间中存放的数据进行操作.人们将变量占据 ...

  9. C++中的static修饰的变量和函数

    原文地址:http://blog.csdn.net/he3913/archive/2008/09/18/2944737.aspxC++里的静态成员函数(不能用const的原因+static在c++中的 ...

  10. ROS学习笔记六：xxx.launch文件详解

    每当我们需要运行一个ROS节点或工具时,都需要打开一个新的终端运行一个命令.当系统中的节点数量不断增加时,每个节点一个终端的模式会变得非常麻烦.那么有没有一种方式可以一次性启动所有节点呢?答案当然是肯 ...