当父层 与子层 有相同的事件时,但子层跟父层执行的内容却不一样时

为了 防止 父层事件对子层造成影响我们可以在子层的方法里做如下操作

function A (event){

  event.stopPropagation();

.....

}

这样我们操作子层的时候 ,父层相同的 事件就不会起作用啦

IE兼容

    function fn2(e){

        //这里做浏览器兼容,如果提供了event 就说明他不是IE
if(e && e.stopPropagation){
e.stopPropagation();
}else {
//IE方式处理事件冒泡
window.event.cancelBubble = true;
} alert("this is btn");
}

js 冒泡事件阻止 父层事件影响子层的更多相关文章

  1. js /jquery停止事件冒泡和阻止浏览器默认事件

    1>js阻止冒泡事件 var el = window.document.getElementById("a"); el.onclick = function (e) { // ...

  2. js冒泡,阻止冒泡

    js 冒泡事件 阻止冒泡 window.onload = function () { var oDiv1 = document.getElementById('div1'); var oDiv2 = ...

  3. 事件穿透父层 直达子层 pointer-events:none

    之前我也做过一些canvas特效,往往在canvas全屏时,canvas下层的div就无法进行dom的事件操作,点击之类的就失灵了.之前我的做法要么就是在canvas上加入点击事件,穿透到下层,或者把 ...

  4. WPF系列之二:解耦View层控件事件与ViewModel层事件的响应

    以前的做法: 1.当项目的时间比较紧迫的时候,对UI层中控件的事件的处理,往往采取的是类似Winform中最简单的做法,直接做一个事件的Handler直接去调用VM层的方法. 2.控件只有一个Comm ...

  5. Js冒泡事件详解及阻止

    Js冒泡机制是指如果某元素定义了事件A,如click事件,如果触发了事件之后,没有阻止冒泡事件,那么事件将向父级元素传播,触发父类的click函数. 如下例所示: <html>     & ...

  6. Atitit.  Js 冒泡事件阻止 事件捕获   事件传递  事件代理

    Atitit.  Js 冒泡事件阻止 事件捕获   事件传递  事件代理   1. 事件冒泡1 2. 事件捕获1 3. 同时支持了事件捕获阶段和事件冒泡阶段ddEventListener的第三个参数1 ...

  7. JS事件冒泡及阻止

    事件冒泡及阻止 当一个元素接收到事件的时候,会把他接收到的事件传给自己的父级,一直到window,当然其传播的是事件,绑定的执行函数并不会传播,如果父级没有绑定事件函数,就算传递了事件,也不会有什么表 ...

  8. Js 冒泡事件阻止

    Js 冒泡事件阻止   1. 事件目标 现在,事件处理程序中的变量event保存着事件对象.而event.target属性保存着发生事件的目标元素.这个属性是DOM API中规定的,但是没有被所有浏览 ...

  9. JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

    在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生. 一.event.stopPropagation() 阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时 ...

随机推荐

  1. MySQL 8.0 安装时 Authentication Method

    1. 使用强密码加密授权(推荐) 8.0提供的心的授权方式,采用SHA256基础的密码加密方法. 但是需要新版本的connector,目前和Connector/J最新的时8.0 目前8.0的连接器和使 ...

  2. Python 编程快速上手 第十一章 Web scrapping

    前言 这一章讲了如何在 Web 上抓取相关的信息,工具是三个模块: webbrowser 模块:用于打开浏览器指定页面 requests 模块:用于下载文件 Beautiful Soup 模块:用于解 ...

  3. 8.2 DRAM和SRAM

    计算机组成 8 存储层次结构 8.2 DRAM和SRAM SRAM比较快,DRAM比较慢:SRAM比较贵,DRAM比较便宜.记住这些结论是很容易的,但是比是什么更重要的是为什么.那在这一节我们就从电路 ...

  4. jq 倒计时

    引入jq 注 在IE和safari 如果时间出现NAN 将时间格式改为YYYY/MM/DD HH:MM:SS 例:var d2 = new Date("2019/02/18 15:59&qu ...

  5. 【洛谷p1164】小A点菜

    (……) 小A点菜[传送门] 上标签: (一个神奇的求背包问题方案总数的题) 核心算法: ;i<=n;i++) for(int j=m;j>=a[i];j--) f[j]+=f[j-a[i ...

  6. 6月5 Smarty变量调节器

    变量调节器:<{$a|变量调节器}> 主要修改此页面的信息来了解变量调节器:test0605/main.php和模板文件:main0605.html 1.利用给定的变量调节器 capita ...

  7. json 常用的序列化 反序列化对象 代码

    序列化对象: ---------------------------------------------------------- Person p = new Person() { Name = & ...

  8. hdu多校1004 Distinct Values

    Distinct Values Time Limit: / MS (Java/Others) Memory Limit: / K (Java/Others) Total Submission(s): ...

  9. openssl安装/更新教程(CentOS)

    1.下载openssl 下载链接:https://www.openssl.org/source/snapshot/ 里边是当前仍支持版本的快照:同版本不同日期内容可能不同的,所以下载一般下对应版本的最 ...

  10. kiss prefix paleo,per,pen,pan,para out 1

      1● paleo 2● per 3● pen 4● pan 5● para   1★ paleo 古   2★ para ,辅助,在旁边   3★ pan 广泛的   4★ per 假,坏,自始自 ...