这里仅仅是一个简单代码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阻止事件冒泡(兼容IE、Chrome、FF)的更多相关文章

  1. JavaScript 阻止事件冒泡的实现方法

    JavaScript 阻止事件冒泡,无使用其它插件来辅助,原生JS代码,考虑到浏览器的兼容性问题,这里对IE/火狐.Operating以及Chrome都有针对性的判断,代码如下: function c ...

  2. javascript阻止事件冒泡的兼容写法及其相关示例

    //阻止事件冒泡的兼容写法 function stopBubble(e){ //如果提供了事件对象,则是一个非IE浏览器 if(e && e.stopPropagation) //因此 ...

  3. javascript 阻止事件冒泡和阻止默认事件对比

    公司项目有像上图中效果的功能需求这也是很常见功能很简单功能,通过一个小例子和大家聊聊js的事件冒泡和默认事件. 先说说一般的实现方式即使用阻止事件冒泡的方式去做,给input绑定一个click事件(并 ...

  4. javascript 阻止事件冒泡 cancelBubble

    javascript简单的阻止事件冒泡,可以使用事件的cancelBubble方法为true: html部分 <button id="btn1">点击显示div< ...

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

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

  6. javascript 阻止事件冒泡

    阻止冒泡 冒泡简单的举例来说,儿子知道了一个秘密消息,它告诉了爸爸,爸爸知道了又告诉了爷爷,一级级传递从而引起事件的混乱,而阻止冒泡就是不让儿子告诉爸爸,爸爸自然不会告诉爷爷了. 举个栗子: 父容器是 ...

  7. JavaScript阻止事件冒泡

    今天在自学敲代码的时候发现了一个问题,当时的例子如下: <!DOCTYPE html> <html lang="en"> <head> < ...

  8. javascript阻止事件冒泡的方法

    有的时候我们需要实现这样的功能: 点击某个蒙版,该蒙版消失,但是如果点击蒙版上的某个元素,希望蒙版不消失,这就需要用到阻止事件的冒泡了 html: <div id="outer&quo ...

  9. JS如果阻止事件冒泡和浏览器默认事件

    原地址:http://missra.com/article/web-57.html 嵌套的标签元素,如果父元素和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,下面介绍一下J ...

随机推荐

  1. java Socket使用详细解释

    客户/server通信模式, client需要主动创造和server Socket(套接字), server端收到了client的连接请求, 也会创建与客户连接的 Socket. Socket可看做是 ...

  2. 高级项目 它 集群环境建设(两)MySQL簇

    最后博文我们介绍一下相关概念集群,今天我们要介绍的博文MySQL相关内容集群. 1.MySQL集群简单介绍 MySQL群集技术在分布式系统中为MySQL数据提供了冗余特性,增强了安全性,使得单个MyS ...

  3. twrp gui/actions.cpp 中的功能实现 tw_action ,tw_action_param ,第二章

    继续分析 twrp ui.xml中的相关内容,以<page name="reboot">为讲解内容 <object type="button" ...

  4. SQL 编码标准

    1. 你必须从别名表,易于使用的表,该表列 实例 select owner,object_id,name from a,b where a.id=b.id; 假设是不正确的别名表.我知道你是怎么访问表 ...

  5. 主从集群搭建及容灾部署redis

    redis主从集群搭建及容灾部署(哨兵sentinel) Redis也用了一段时间了,记录一下相关集群搭建及配置详解,方便后续使用查阅. 提纲 l  Redis安装 l  整体架构 l  Redis主 ...

  6. redmine使用汇总redmine软件工程过程

    1.强制性当一个新的问题:轨道.议题.叙述性说明.状态.优先.分配给.父任务(假设没有可以不填,假设有请务必填写).开始日期.预计时间.党羽,请注意,这时候一定不要填写完成时间 2.如果你想在实时登记 ...

  7. linux下一个oracle11G DG建立(一个):准备环境

    linux下一个oracle11G  DG建立(一个):准备环境 周围环境 名称 主库 备库 主机名 bjsrv shsrv 软件版本号 RedHat Enterprise5.5.Oracle 11g ...

  8. 2014百度之星资格赛——Disk Schedule

    2014百度拥有明星格比赛--Disk Schedule Problem Description 有非常多从磁盘读取数据的需求,包含顺序读取.随机读取. 为了提高效率.须要人为安排磁盘读取. 然而.在 ...

  9. Git使用汇总

    1.下载代码,代码被下载到本地 git clone https://github.com/nuptboyzhb 2.提交代码 git commit -a -m "期间提交的信息叙述性说明&q ...

  10. mac平台adb、tcpdump捕手android移动网络数据包

    在移动电话的发展app当我们希望自己的下才能看到app网络发出请求,这个时候我们需要tcpdump工具包捕获.实现tcpdump空灵,以下步骤需要: 在这里,在android 华为手机 P6对于样本 ...