<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>阻止冒泡和默认事件</title>

</head>

<body>

<button>阻止冒泡和默认事件</button>

<script>

    function stopPropagation(e) {

        if (e && e.stopPropagation) {

            console.log(1);

            e.stopPropagation();//阻止冒泡非ie8及以下版本

        } else {

            console.log(2);

            window.event.cancelBubble = true;//阻止冒泡ieie8及以下版本

        }

        if (e && e.preventDefault ) {

            console.log(3);

            e.preventDefault();//阻止默认非ie8及以下版本

        } else {

            console.log(4);

            window.event.returnValue = false;//阻止默认ie8及以下版本

        }

    }

    var btn=document.getElementsByTagName("button")[0];

    btn.onclick= function (e) {

        alert(111);

        stopPropagation(e);

    };

    document.onclick= function () {

        alert(222);

    }

//移动端禁止页面下拉

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

</script>

 </body> 

</html>

js阻止冒泡和默认事件的更多相关文章

  1. js阻止冒泡和默认事件（默认行为）详解- jquery DefaultPrevented 函数

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

  2. js阻止元素的默认事件与冒泡事件

    嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,从而带来一定的影响. 1. event.preventDefault();  -- 阻止元素的默认 ...

  3. jQuery 阻止冒泡和默认事件

    jQuery event.preventDefault() 方法 event.preventDefault() 方法阻止元素发生默认的行为. 例如: 当点击提交按钮时阻止对表单的提交 阻止以下 URL ...

  4. 基本event封装：阻止冒泡、默认事件等

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

  5. js阻止a标签默认事件的几种方法

    方法/步骤    疑问 打开编辑器,新建html并加入a标签,如图所示,小编想点击a标签时执行pop函数同时禁止a标签的默认的href跳转,该如何阻止呢?  方法一 要阻止a标签跳转,可以改变href ...

  6. js阻止冒泡及jquery阻止事件冒泡示例介绍

    js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容. 复制代码 代码如下: function stopPro(evt){ var e = evt || window ...

  7. JS点击子元素不触发父元素点击事件(js阻止冒泡)

    js阻止冒泡 <html> <title></title> <head> <meta charset="utf-8"> ...

  8. 前端（十五）—— JavaScript事件：绑定事件方式、事件的冒泡和默认事件、鼠标事件、键盘事件、表单 事件、文档事件、图片事件、页面事件

    JS事件:绑定事件方式.事件的冒泡和默认事件.鼠标事件.键盘事件.表单 事件.文档事件.图片事件.页面事件 一.事件的两种绑定方式 1.on事件绑定方式 document.onclick = func ...

  9. js阻止冒泡

    js阻止冒泡 (ev || event).cancelBubble = true; 标签切换 <script type="text/javascript"> windo ...

随机推荐

  1. thinkphp 系统流程

    用户URL请求 调用应用入口文件(通常是网站的index.php) 载入框架入口文件(ThinkPHP.php) 记录初始运行时间和内存开销 系统常量判断及定义 载入框架引导类(Think\Think ...

  2. CentOS 7.2部署NTP服务器实现时间同步

    CentOS 7.2部署NTP服务器实现时间同步 [日期:2017-12-18] 来源:Linux社区  作者:梁明远 [字体:大 中 小]   1. 前言 对于容器编排系统,前段时间主要研究kube ...

  3. react 组件的生命周期 超简版

    组件从被创建到被销毁的过程称为组件的 生命周期: 通常,组件的生命周期可以被分为三个阶段:挂载阶段.更新阶段.卸载阶段: 一.挂载阶段 这个阶段组件被创建,执行初始化,并被挂载到DOM中,完成组件的第 ...

  4. (转)iframe 高度100%时，出现垂直滚动条

    问题 需求是这样的,iframe在一个div中,并且iframe高度与div一样,所以设置了iframe高度是100%,结果div出现了滚动条,在排除了padding.margin的因素外,还是有滚动 ...

  5. js 中继承方式小谈

    题外话 前段时间面试中笔试题有这道题目: 请实现一个继承链,要求如下: 构造函数A():构造函数中有consoleA方法,可以实现console.log("a") 实例对象 a:a ...

  6. mac 10.9 install cocoapods issue

    If you've installed the OS X Mavericks Beta and you're having ruby issues like this: /System/Library ...

  7. 牛客多校第六场 A Garbage 模拟/签到

    题意: 给你一个字符串,代表一个垃圾都有哪些物质组成,再给你一个字符串,代表a-z代表的物质分别是有害物质,干物质还是湿物质,根据题目的定义,回答是什么垃圾. 题解: 根据题意模拟即可. #inclu ...

  8. VS2010-MFC（图形图像：CDC类及其屏幕绘图函数）

    转自:http://www.jizhuomi.com/software/244.html 上一节讲了文本输出的知识,本节的主要内容是CDC类及其屏幕绘图函数. CDC类简介 CDC类是一个设备上下文类 ...

  9. STM32笔记——Power Controller(PWR)

    The device requires a 1.8 to 3.6 V operating voltage supply (VDD). An embedded linear voltage regula ...

  10. 最近看了关于java的几条帖子，写的不错，总结了一下

    1.最开始写代码,例如C语言(“一次编写,到处编译”)都是经过编译后生成汇编码,直接在cpu上执行. 因为不同的硬件架构和操作系统,会导致不同的cpu支持的指令可能不同,也就是说不通类型的cpu所能执 ...