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

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

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. learn the python the hard way习题11~17总结

    关于 input() 格式: input("prompt")功能:从 CLI 获取 User 的一个输入,显示 promt 的内容,并且返回一个 string 类型的数值其他:如果 ...

  2. spring cloud: zuul(四): 正则表达式匹配其他微服务(给其他微服务加版本号)

    spring cloud: zuul(四): 正则表达式匹配其他微服务(给其他微服务加版本号) 比如我原来有,spring-boot-user微服务,后台进行迭代更新,另外其了一个微服务: sprin ...

  3. 安卓四大组件之Sevice组件的简单使用 --Android基础

    1.本例实现了简单的Service(服务)的创建.启动和停止,点击“启动SERVICE”页面会显示“服务被创建”,接着是“服务被启动”.点击“停止SERVICE”页面提示“服务被停止”.太过基础,直接 ...

  4. xsd与xml和类(class)对象之间的互相转换

    xsd与xml和类(class)对象之间的互相转换 . 第一:通过现有的已经写好的xsd来生成class(.cs)文件. 在您Visual Studio的安装目录下的SDKv2.0Bin中有个应用程序 ...

  5. LeetCode--235--二叉树的最近公共祖先

    问题描述: 给定一个二叉搜索树, 找到该树中两个指定节点的最近公共祖先. 百度百科中最近公共祖先的定义为:“对于有根树 T 的两个结点 p.q,最近公共祖先表示为一个结点 x,满足 x 是 p.q 的 ...

  6. pre打印

    echo "<pre>";print_r(var);echo "</pre>";

  7. 第一章:IPsecVPN

    第一章 一.VPN(virtual private Network,虚拟专用网)的基本概念 VPN连接模式分为两种,分别是传输模式和隧道模式 传输模式:在整个VPN传输中,ip包头并没有被封装进去 隧 ...

  8. js删除数组中元素的方法

    一.清空数组 var ary = [1,2,3,4]; ary.splice(0,ary.length);//清空数组 console.log(ary); // 输出 [],空数组,即被清空了 二.删 ...

  9. [python] 查找列表中重复的元素

    a = [1, 2, 3, 2, 1, 5, 6, 5, 5, 5] b = set(a) for each_b in b: count = 0 for each_a in a: if each_b ...

  10. CF-339D-线段树

    http://codeforces.com/problemset/problem/339/D 给出一个序列.每次更改其中一个值然后询问序列的f(),序列的f()定义为: 每相邻两个元素按位或得到长度减 ...