<!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. Flask扩展 -- flask-mail

    电子邮件是最常用的通信方式之一.虽然Python标准库中的smtplib包可用在Flask程序中发送电子邮件,但包装了smtplib的Flask-Mail扩展能更好的和Flask集成. 1.安装Fla ...

  2. 在类中,调用这个类时,用$this->video_model是不是比每次调用这个类时D('Video')效率更高呢

    在类中,调用这个类时,用$this->video_model是不是比每次调用这个类时D('Video')效率更高呢  

  3. 没有找到mfc100.dll

    转自VC错误:http://www.vcerror.com/?p=86 问题描述: 生成的exe文件在编译的时候会提示"没有找到mfc100.dll",这个时候需要更改配置为静态编 ...

  4. vue-router路由跳转判断用户是否存在

    router.beforeEach((to, from, next) => { //console.log("to:", (to)); //console.log(" ...

  5. java_List接口

    /** * java.util.list接口 extends Collection接口 * 1.有序的集合 * 2.有索引 * 3.元素可以重复 * * List中带索引的方法: *add:添加 * ...

  6. JS流程控制语句 退出循环break 在while、for、do...while、while循环中使用break语句退出当前循环,直接执行后面的代码。

    退出循环break 在while.for.do...while.while循环中使用break语句退出当前循环,直接执行后面的代码. 格式如下: for(初始条件;判断条件;循环后条件值更新) { i ...

  7. JS规则 表达出你的想法(表达式) 通常包括常数和变量 var num2 = num1+6;

    表达出你的想法(表达式) 表达式与数学中的定义相似,表达式是指具有一定的值.用操作符把常数和变量连接起来的代数式.一个表达式可以包含常数或变量. 我们先看看下面的JavaScript语句: 生活中&q ...

  8. nodejs实现读取文件

    今天后端同事下班,想让我读取一个文件的内容.我想这个是小忙啊,就立马答应了. 我知道这个是nodejs读取,可是我又想,平时我们都要起一个服务才能够运行node服务器, 比如如下代码 var http ...

  9. 转载别人的ftp,觉得目录结构不错,学习

    开发简单的FTP:1. 用户登陆2. 上传/下载文件3. 不同用户家目录不同4. 查看当前目录下文件5. 充分使用面向对象知识 REDMAE 1 用户登陆 2 3 1.查看用户目录文件 4 2.上传文 ...

  10. Java事件监听机制与观察者设计模式

    一. Java事件监听机制 1. 事件监听三要素: 事件源,事件对象,事件监听器 2. 三要素之间的关系:事件源注册事件监听器后,当事件源上发生某个动作时,事件源就会调用事件监听的一个方法,并将事件对 ...