事件冒泡:

当一个元素上的事件被触发时,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先中被触发,这一过程被称为事件冒泡。

这个事件从原始祖先开始,一直冒泡到DOM树的最上层。(bug)

(本来应该一人做事一人当,结果我做错了事,你却去告诉了我妈)

简单来说,冒泡就是:子元素事件被触动,父盒子的同样事件也会被触动。

取消冒泡就是取消这种机制。

阻止冒泡:

火狐、谷歌、IE11:event.stopPropagation();

IE10以下:event.cancelBubble = true;

兼容代码:

a.onclick = function (event) {

//阻止冒泡
event = event || window.event;
if(event && event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble = true;
}

}

javascript 事件冒泡与取消冒泡的更多相关文章

  1. JavaScript事件:事件处理模型(冒泡、捕获)、取消冒泡、阻止默认事件

    (一)事件处理模型---事件冒泡.捕获 (1)事件冒泡 24 <body> 25 <div class="warpper"> 26 <div clas ...

  2. 第一百二十节,JavaScript事件对象

    JavaScript事件对象 学习要点: 1.事件对象 2.鼠标事件 3.键盘事件 4.W3C与IE JavaScript事件的一个重要方面是它们拥有一些相对一致的特点,可以给你的开发提供更多的强大功 ...

  3. javascript的自定义对象/取消事件/事件兼容性/取消冒泡

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 解析Javascript事件冒泡机制

    本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...

  5. JavaScript事件——冒泡、捕获

    本节要点:1.干预系统的事件处理机制 (一)DOM事件流 (二)停止事件冒泡 (三)阻止事件的默认行为 1.干预系统的事件处理机制 (一)DOM事件流 DOM模型是一个树形结构,在DOM模型中,HTM ...

  6. Javascript事件冒泡机制

    1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3scho ...

  7. javascript事件捕获与冒泡

    对“捕获”和“冒泡”这两个概念,我想我们对冒泡更熟悉一些,因为在我们使用的所有浏览器中,都支持事件冒泡,即事件由子元素向祖先元素传播的,就 像气泡从水底向水面上浮一样.而在像firefox,chrom ...

  8. javascript事件冒泡

    1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3scho ...

  9. JavaScript:事件对象Event和冒泡

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 绑定事件的两种方式 我们在上一篇文章中已经讲过事件的概念.这里讲一下注册 ...

随机推荐

  1. MySQLi面向对象实践--multi_query

    使用multi_query可以实现执行多条SQL语句,每一条SQL语句通过分号分隔. 需要注意的是: 多条用分号分隔的SQL语句中,只要有一条SQL语句执行失败,那么这一条SQL语句以及之后的SQL语 ...

  2. PAT 1002 写出这个数

    https://pintia.cn/problem-sets/994805260223102976/problems/994805324509200384 读入一个自然数n,计算其各位数字之和,用汉语 ...

  3. Install odoo 11(10) on centos7

    https://www.odoo.com/documentation/11.0/setup/install.html https://nightly.odoo.com/ https://www.odo ...

  4. Docker for windows WIN版本,主板特性问题

    WIN 10 Home版无法开启Hyper-V特性. Docker for windows有Hyper-V和VirtualBox两个版本: https://forums.docker.com/t/in ...

  5. dotnet core 安装

    sudo rpm --import https://packages.microsoft.com/keys/microsoft.asc sudo sh -c 'echo -e "[packa ...

  6. spark中saveAsTextFile的错误

    写了很简单的一段spark代码,将结果保存为windows本地文件,执行之后总是报错NullPointerException 查询之后 发现是本地缺少hadoop需要的一个文件所致 如果本地已经安装了 ...

  7. GlusterFS卷的优化

    GlusterFS可以通过配置选项来优化卷 配置选项 用途 默认值 合法值 network.ping-timeout    客户端等待检查服务器是否响应的持续时间,节点挂了数据不能写入 42 0-42 ...

  8. mysql 8.0,运行springboot项目配置:

    1.修改pom.xml <dependency> <groupId>mysql</groupId> <artifactId>mysql-connecto ...

  9. Luogu4238 【模板】多项式求逆(NTT)

    http://blog.miskcoo.com/2015/05/polynomial-inverse 好神啊! B(x)=B'(x)·(2-A(x)B'(x)) 注意ntt的时候防止项数溢出,即将多项 ...

  10. MT【16】证明无理数(2)

    证明:$sin10^0$为无理数. 分析:此处用$sin$的三倍角公式,结合多项式有有理根必须满足的系数之间的关系可以证明. 评:证明$sin9^0$为无理数就不那么简单.思路:先利用$sin54^0 ...