zoukankan      html  css  js  c++  java
  • js 停止事件冒泡 阻止浏览器的默认行为

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

    浏览器默认行为:

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

    a标签

    1..停止事件冒泡

    JavaScript代码

     

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

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

    JavaScript代码

     1 element.onclick = function(event) {  
     2 
     3    event = event || window.event;   
     4 
     5 //如果提供了事件对象,则这是一个非IE浏览器 
     6 
     7 if (event&& event.preventDefault) {
     8 
     9   //阻止默认浏览器动作(W3C) 
    10 
    11         event.preventDefault();  
    12 
    13     } else { 
    14 
    15     //IE中阻止函数器默认动作的方式 
    16 
    17         window.event.returnValue = false;  
    18 
    19     }  
    20 
    21   //event.preventDefault?event.preventDefault():(event.returnValue = false);  
    22 
    23 }  

    或者直接返回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

  • 相关阅读:
    .NET反射的优化
    jdk、tomcat、solr环境搭建
    实现简单的ORM
    异步async/await简单应用与探究
    线程(Thread,ThreadPool)、Task、Parallel
    序列化
    IEnumerable与IEnumerator
    URL重写与URL路由
    django rest framework(10)
    restful 规范
  • 原文地址:https://www.cnblogs.com/beileixinqing/p/6503688.html
Copyright © 2011-2022 走看看