在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”。

浏览器默认行为:

在form中按回车键就会提交表单;单击鼠标右键就会弹出context menu.

a标签

1..停止事件冒泡

JavaScript代码

 //如果提供了事件对象,则这是一个非IE浏览器
if ( e && e.stopPropagation )
//因此它支持W3C的stopPropagation()方法
e.stopPropagation();
else
//否则,我们需要使用IE的方式来取消事件冒泡
window.event.cancelBubble = true;
return false;

2.阻止浏览器的默认行为

JavaScript代码

 element.onclick = function(event) {  

    event = event || window.event;   

 //如果提供了事件对象,则这是一个非IE浏览器 

 if (event&& event.preventDefault) {

   //阻止默认浏览器动作(W3C) 

         event.preventDefault();  

     } else { 

     //IE中阻止函数器默认动作的方式 

         window.event.returnValue = false;  

     }  

   //event.preventDefault?event.preventDefault():(event.returnValue = false);  

 }  

或者直接返回false:

element.onclick = function(event) {
//...
return false;
}

但是在使用return false时必须注意:
1、jQuery有自己的事件处理层,也对处理程序做了封装,如果事件处理程序返回false,事件冒泡和浏览器默认事件都会被阻止。
2、使用原生javaScript,在事件处理程序中返回false只会阻止浏览器默认行为,而事件冒泡依然存在。
3、浏览器默认行为和事件冒泡是相互独立的。阻止事件冒泡不会影响默认行为,反之亦然。

注意:
有一些浏览器行为是在事件处理程序执行前发生的,也就是说这些默认行为是无法取消的,如:在大部分浏览器上鼠标移到一个超链接上超链接的样式会发生改变,这个动作是发生在focus事件之前的,是focus事件处理程序中无法取消的。

摘自:http://blog.csdn.net/jquery_qq/article/details/51568816

http://www.cnblogs.com/yuzhongwusan/archive/2008/12/27/1363417.html

js 停止事件冒泡 阻止浏览器的默认行为的更多相关文章

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

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

  2. js 停止事件冒泡 阻止浏览器的默认行为(阻止a标签跳转 )

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到"停止事件冒泡"和"阻止浏览器默认行为". 1..停止事件冒泡 JavaScript代码 //如果提供了 ...

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

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

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

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

  5. javascript阻止事件冒泡和浏览器的默认行为

    1.阻止事件冒泡,使成为捕获型事件触发机制. 1 function stopBubble(e) { 2 //如果提供了事件对象,则这是一个非IE浏览器 3 if ( e && e.st ...

  6. JS停止事件冒泡

    ..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器 if ( e && e.stopPropagation ) //因此它支持W3C的stopP ...

  7. JQuery 阻止js事件冒泡 阻止浏览器默认操作

    //阻止事件冒泡 event.stopPropagation(); //阻止浏览器默认操作 event.preventDefault(); 代码不一定能执行,写给自己看的. 事件冒泡: <a h ...

  8. js阻止浏览器的默认行为以及停止事件冒泡(用JQuery实现回车提交,兼容IE、FF浏览器) 转

    1.阻止浏览器的默认行为 function stopDefault(e) { //如果提供了事件对象,则这是一个非IE浏览器 if(e && e.preventDefault) { / ...

  9. js中阻止事件冒泡和浏览器默认行为

    在使用javascript编程时会遇到一个问题,就是当你给html添加事件时,由于浏览器默认的为冒泡型事件触发机制,所以会触发你不想触发的事件.那么通过如下的函数可以解决这个问题.[兼容IE和FF] ...

随机推荐

  1. 【Android】7.2 LinearLayout(线性布局)

    分类:C#.Android.VS2015: 创建日期:2016-02-10 一.简介 LinearLayout将容器内的组件一个挨着一个地横向或纵向依次堆叠起来(不重叠).该布局和WPF的StackP ...

  2. Mingw opencv Windows下命令行运行

    1.下载opencv 2.3 http://sourceforge.net/projects/opencvlibrary/files/ 下个opencv-win版本吧 至于版本号就随意吧,我选的是2. ...

  3. ny643 发短信 stl库 map函数

    发短信 时间限制:1000 ms  |            内存限制:65535 KB 难度:3           描述 下图是手机常用的九键英文输入法界面,如果要输入字母'A',我们只 需要按一 ...

  4. [转帖]cocos2D-X源码分析之从cocos2D-X学习OpenGL(3)----BATCH_COMMAND

    原贴: cocos2D-X源码分析之从cocos2D-X学习OpenGL(3)----BATCH_COMMAND 上一篇介绍了QUAD_COMMAND渲染命令,顺带介绍了VAO和VBO,这一篇介绍批处 ...

  5. Mock制作假数据

    name 为属性名, rule 为规则, value 为值,属性名和生成规则之间用|分隔,生成规则的格式有7种: 字符串 String, 数字 Number, 布尔型 Boolean, 对象 Obje ...

  6. Redis之Python操作

    Redis简单介绍 如果简单地比较Redis与Memcached的区别,大多数都会得到以下观点:1 Redis不仅仅支持简单的k/v类型的数据,同时还提供list,set,zset,hash等数据结构 ...

  7. JAVA-JSP指令元素之page指令

    相关资料:<21天学通Java Web开发> 结果总结:1.page设定JSP页面全局属性,作用于整个JSP页面,包括静态包含的文件2.<%@ page 属性1="属性值1 ...

  8. 使用conda 对gcc进行升级 (sonicparanoid)

    由于要是用python 3.6版本的一个包sonicparanoid,但是系统的gcc比较老,所以先用conda创建python环境,在该环境下尽心gcc的安装和升级 conda create --n ...

  9. C++基础学习-20120515

    1---------带参数的构造函数B (int i) : data(i);//data=i冒号后面是成员变量初始化列表member initialization list 2-----------拷 ...

  10. 适配器模式和外观模式(head first设计模式——6)

    为什么要把适配器模式和外观模式放在同一篇文章中,主要是其相对前面的几个模式来讲会简单些并且具有相似之处.下面就分别通过例子来看理解一下两种模式,然后再进行对其进行比较. 一.适配器模式 1.1适配器模 ...