兼容各大浏览器的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>

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

Javascript 相关文章推荐
Dom加载让图片加载完再执行的脚本代码
May 15 Javascript
基于jquery的页面划词搜索JS
Sep 14 Javascript
JQuery切换显示的效果实例代码
Feb 27 Javascript
Js动态设置rem来实现移动端字体的自适应代码
Oct 14 Javascript
jQuery制作图片旋转效果
Feb 02 Javascript
WebStorm ES6 语法支持设置&amp;babel使用及自动编译(详解)
Sep 08 Javascript
利用Console来Debug的10个高级技巧汇总
Mar 26 Javascript
Vuex中的State使用介绍
Jan 19 Javascript
微信公众号平台接口开发 菜单管理的实现
Aug 14 Javascript
vue遍历对象中的数组取值示例
Nov 07 Javascript
js实现上传按钮并显示缩略图小轮子
May 04 Javascript
js实现随机圆与矩形功能
Oct 29 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
You might like
PR值查询 | PageRank 查询
2006/12/20 PHP
php中定时计划任务的实现原理
2013/01/08 PHP
详解PHP+AJAX无刷新分页实现方法
2015/11/03 PHP
Laravel手动返回错误码示例
2019/10/22 PHP
PHP使用Http Post请求发送Json对象数据代码解析
2020/07/16 PHP
input链接页面、打开新网页等等的具体实现
2013/12/30 Javascript
JavaScript中this关键词的使用技巧、工作原理以及注意事项
2014/05/20 Javascript
js鼠标悬浮出现遮罩层的方法
2015/01/28 Javascript
Bootstrap按钮下拉菜单组件详解
2016/05/10 Javascript
再次谈论Javascript中的this
2016/06/23 Javascript
JS常用倒计时代码实例总结
2017/02/07 Javascript
vue实现前进刷新后退不刷新效果
2018/01/26 Javascript
javascript自定义日期比较函数用法示例
2019/07/22 Javascript
Windows下安装 node 的版本控制工具 nvm
2020/02/06 Javascript
toString.call()通用的判断数据类型方法示例
2020/08/28 Javascript
SublimeText 2编译python出错的解决方法(The system cannot find the file specified)
2013/11/27 Python
python模块简介之有序字典(OrderedDict)
2016/12/01 Python
Python 常用 PEP8 编码规范详解
2017/01/22 Python
python实现稀疏矩阵示例代码
2017/06/09 Python
python脚本生成caffe train_list.txt的方法
2018/04/27 Python
Python实现快速计算词频功能示例
2018/06/25 Python
Python基础之条件控制操作示例【if语句】
2019/03/23 Python
Python多线程获取返回值代码实例
2020/02/17 Python
numpy矩阵数值太多不能全部显示的解决
2020/05/14 Python
Python自动化办公Excel模块openpyxl原理及用法解析
2020/11/05 Python
python 实现汉诺塔游戏
2020/11/28 Python
印度最大的酒店品牌网络:OYO Rooms
2016/07/24 全球购物
英国在线房屋中介网站:Yopa
2018/01/09 全球购物
Juicy Couture Beauty官方网站:香水和化妆品
2019/03/12 全球购物
医学毕业生自荐信
2013/10/11 职场文书
大学生村官座谈会发言材料
2014/05/25 职场文书
启动仪式策划方案
2014/06/14 职场文书
公司员工活动策划方案
2014/08/20 职场文书
2014年教师业务工作总结
2014/12/19 职场文书
2014年班级工作总结范文
2014/12/23 职场文书
导游词之日月潭
2019/11/05 职场文书