兼容各大浏览器的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 相关文章推荐
js实现DIV的一些简单控制
Jun 04 Javascript
window.ActiveXObject使用说明
Nov 08 Javascript
javascript中的关于类型转换的性能优化
Dec 14 Javascript
js实现iframe跨页面调用函数的方法
Dec 13 Javascript
JS实现自适应高度表单文本框的方法
Feb 25 Javascript
jQuery+Ajax实现无刷新操作
Jan 04 Javascript
js实现小窗口拖拽效果
Dec 03 Javascript
Vue组件选项props实例详解
Aug 18 Javascript
vuejs 动态添加input框的实例讲解
Aug 24 Javascript
解决angularJS中input标签的ng-change事件无效问题
Sep 13 Javascript
浅谈VUE-CLI脚手架热更新太慢的原因和解决方法
Sep 28 Javascript
layui table 列宽百分比显示的实现方法
Sep 28 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
php中变量及部分适用方法
2008/03/27 PHP
php判断页面是否是微信打开的示例(微信打开网页)
2014/04/25 PHP
遍历指定目录,并存储目录内所有文件属性信息的php代码
2016/10/28 PHP
php curl操作API接口类完整示例
2019/05/21 PHP
Smarty模板配置实例简析
2019/07/20 PHP
jquery $.ajax()取xml数据的小问题解决方法
2010/11/20 Javascript
jquery实现兼容浏览器的图片上传本地预览功能
2013/10/14 Javascript
jQuery中的编程范式详解
2014/12/15 Javascript
jQuery插件开发的五种形态小结
2015/03/04 Javascript
jquery对象和DOM对象的相互转换详解
2016/10/18 Javascript
jquery UI Datepicker时间控件冲突问题解决
2016/12/16 Javascript
JavaScript使用readAsDataUrl方法预览图片
2017/05/10 Javascript
Vue打包后出现一些map文件的解决方法
2018/02/13 Javascript
微信小程序动态生成二维码的实现代码
2018/07/25 Javascript
在vue项目中引入高德地图及其UI组件的方法
2018/09/04 Javascript
Vue官方推荐AJAX组件axios.js使用方法详解与API
2018/10/09 Javascript
vue实现todolist功能、todolist组件拆分及todolist的删除功能
2019/04/11 Javascript
nodejs对mongodb数据库的增加修删该查实例代码
2020/01/05 NodeJs
基于javascript实现碰撞检测
2020/03/12 Javascript
JavaScript常用工具函数大全
2020/05/06 Javascript
如何利用JS将手机号中间四位变成*号
2020/09/29 Javascript
python的描述符(descriptor)、装饰器(property)造成的一个无限递归问题分享
2014/07/09 Python
简单讲解Python编程中namedtuple类的用法
2016/06/21 Python
python中requests小技巧
2017/05/10 Python
Python探索之静态方法和类方法的区别详解
2017/10/27 Python
python 随机打乱 图片和对应的标签方法
2018/12/14 Python
Python实现点阵字体读取与转换的方法
2019/01/29 Python
Python 多线程,threading模块,创建子线程的两种方式示例
2019/09/29 Python
CSS3制作日历实现代码
2012/01/21 HTML / CSS
MATCHESFASHION澳大利亚/亚太地区:英国时尚奢侈品电商
2020/01/14 全球购物
计算机专业毕业生自荐信
2013/12/31 职场文书
继电保护工岗位职责
2014/01/05 职场文书
奖学金感谢信
2015/01/21 职场文书
销售开票员岗位职责
2015/04/15 职场文书
Python+腾讯云服务器实现每日自动健康打卡
2021/12/06 Python
Win11怎么把合并的任务栏分开 Win11任务栏合并分开教程
2022/04/06 数码科技