什么叫事件冒泡

当给父子元素的同一事件绑定方法时,触发了子元素身上的事件,执行完毕之后,也会触发父级元素的相同事件,这种传播机制叫事件冒泡。

取消事件冒泡

Event对象有个属性叫cancelBubble默认值是false改成true就取消当前事件冒泡

$(”c“).onclick=function(){

event.cancelBubble=true

alert("ccccc")

}

Js高级 事件冒泡的更多相关文章

  1. 浅谈js的事件冒泡机制

    很多人都听说过,js的事件冒泡机制,其实,这个说法还是比较生动形象的,就是一个水泡在水底下,冒泡到水面的过程. 那js的事件冒泡机制呢,就是一个DOM树,一级一级向上冒的过程,最终是到document ...

  2. vue.js阻止事件冒泡和默认事件

    首先我们来看原生JS取消事件冒泡方法: e.stopPropagation(); //非IE浏览器window.event.cancelBubble = true; //IE浏览器 原生JS阻止默认事 ...

  3. js阻止浏览器、元素的默认事件与js阻止事件冒泡、阻止事件流

    嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,下面介绍一下js阻止默认事件与js阻止事件冒泡示例,大家参考使用吧   1. event.prev ...

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

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

  5. js的事件冒泡机制

    js的事件冒泡机制呢,就是一个DOM树,一级一级向上冒的过程,最终是到document这个根节点这里.js的事件冒泡机制,就像是一个水泡在水底下,冒泡到水面的过程. 摘自醉清玄

  6. JS阻止事件冒泡

    在使用JS事件的时候,外层元素事件有可能被里层元素的事件触发,例如点击里层元素外层也触发了点击,这种现象称为事件冒泡.(李昌辉) <div id="wai"> < ...

  7. js 阻止事件冒泡和默认行为 preventDefault、stopPropagation、return false

    preventDefault: preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认行为.既然是说默认行为,当然是元素必须有默认行为才能被取消,如果元素本身就 ...

  8. js 停止事件冒泡 阻止浏览器的默认行为(阻止超连接 # )

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...

  9. JS中 事件冒泡与事件捕获

    [JS中的事件流]  1.事件冒泡:当某DOm元素触发一种事件时,会从当前节点开始,逐级往上触发其祖先节点的同类型事件,直到DOM根节点:   >>>什么情况下会产生事件冒泡 ① D ...

随机推荐

  1. Learning-MySQL【6】:视图、触发器、存储过程、函数、流程控制

    一.视图 视图就是通过查询得到一张虚拟表,然后保存下来,下次用的直接使用即可.使用视图我们可以把查询过程中的临时表摘出来,用视图去实现,这样以后再想操作该临时表的数据时就无需重写复杂的 SQL 语句了 ...

  2. 一招破解 Java 集合类面试题

    今日招式:Java集合类面试题 Java集合类绝对是我们的老朋友了,Java技术江湖里,谁人不知,谁人不晓,它的使用率非常高,使用难度却也不大,这也导致了很多人对它不屑一顾,殊不知其中却暗藏玄机,今天 ...

  3. OPENAPI规范Swagger

    OPENAPI规范 是一种规范,Swagger是一种工具,Swagger帮我们使用OPENAPI更具体更完善,更好. 博客1:https://app.swaggerhub.com/help/index ...

  4. Asp.net core 学习笔记 ( Smtp and Razor template 电子邮件和 Razor 模板 )

    refer : https://dotnetcoretutorials.com/2017/08/20/sending-email-net-core-2-0/ https://ppolyzos.com/ ...

  5. 第 8 章 容器网络 - 063 - 如何使用 Weave 网络?

    如何使用 Weave 网络? weave 是 Weaveworks 开发的容器网络解决方案. weave 创建的虚拟网络可以将部署在多个主机上的容器连接起来. 对容器来说,weave 就像一个巨大的以 ...

  6. 『流畅的Python』第5章笔记_一等函数

  7. Dockerfile命令大全

    Dockerfile 制作Dockerfile为Docker入门学习的第一步. Dockerfile可以快速的帮助我们去构建镜像, 是在工作中必备的一项技能, 下面整理了一些命令 FROM 功能为指定 ...

  8. 云服务器上mysql的配置

    mysql的配置 要想云服务器的mysql数据库能被外部连接,还需要做一些配置 首先执行下面三条命令: sudo apt-get install mysql-server sudo apt isnta ...

  9. eslint详细配置

    vue-cli3按照官网教程配置搭建后,发现每次编译,eslint都抛出错误, 修改配置在 .eslintrc.js中修改   或者  关闭eslint 1.关闭eslint 直接注释掉package ...

  10. PHP文件PHP代码及运行(适合PHP初学者)

    本文转自:https://blog.csdn.net/cnds123/article/details/80700444 如果在warmpserver上运行php只显示源代码,可能是在用记事本保存后缀为 ...