编程 Javascript

兼容各大浏览器的JavaScript阻止事件冒泡代码

Posted in Javascript onJuly 09, 2015

这里仅仅是一个简单代码demo，因为时间问题并未做深入研究，因为今天做项目时要用到阻止事件冒泡的内容，找了好多才找到一个可以使用的，特记录之。

<!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>阻止事件冒泡</title>
  <script src="js/jquery-1.11.3.min.js"></script>
  <script src="js/jquery.cookie.js"></script>
  <style type="text/css">
  </style>
  <script type="text/javascript">
    function clickDiv(){
      alert("clickDiv");
    }
    function clickP(event){
      stopEvent(event);
      alert("clickP");
    }
    function stopEvent(event){ //阻止冒泡事件
     //取消事件冒泡
     var e=arguments.callee.caller.arguments[0]||event; //若省略此句，下面的e改为event，IE运行可以，但是其他浏览器就不兼容
     if (e && e.stopPropagation) {
     // this code is for Mozilla and Opera
     e.stopPropagation();
     } else if (window.event) {
     // this code is for IE
      window.event.cancelBubble = true;
     }
    }
  </script>
</head>
<body>
  <div onclick="clickDiv()" style="width:100px; height:100px; background-color:red;">
    <p onclick="clickP(event)" style="width:50px; height:50px; margin:auto; background-color:green;">
      abad
    </p>
  </div>
  <script type="text/javascript">
  </script>
</body>
</html>

以上所述就是本文的全部内容了，希望大家能够喜欢。

- Author -

hebedich

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript缓冲运动实现方法(2则示例)

Jan 08 Javascript

JavaScript模拟鼠标右键菜单效果

Dec 08 Javascript

bootstrap配合Masonry插件实现瀑布式布局

Jan 18 Javascript

angularjs使用directive实现分页组件的示例

Feb 07 Javascript

详解webpack进阶之插件篇

Jul 06 Javascript

javascript 玩转Date对象(实例讲解)

Jul 11 Javascript

详解Vue Elememt-UI构建管理后台

Feb 27 Javascript

微信小程序中的店铺评分组件及vue中用svg实现的评分显示组件

Nov 16 Javascript

vue+elementUi图片上传组件使用详解

Aug 20 Javascript

Vue学习之组件用法实例详解

Jan 06 Javascript

vue项目配置使用flow类型检查的步骤

Mar 18 Javascript

JavaScript实现与web通信的方法详解

Aug 07 Javascript

JavaScript包装对象使用详解

Jul 09 #Javascript

jquery实现表单验证并阻止非法提交

Jul 09 #Javascript

jQuery实现tab选项卡效果的方法

Jul 08 #Javascript

jQuery实现类似淘宝网图片放大效果的方法

Jul 08 #Javascript

javascript实现10个球随机运动、碰撞实例详解

Jul 08 #Javascript

详细分析JavaScript变量类型

Jul 08 #Javascript

js实现图片点击左右轮播

Jul 08 #Javascript