阻止子元素继承父元素事件具体思路及实现


Posted in Javascript onMay 02, 2013
<div id="p_box" onclick="a()"> 
<div id=p_cont> 
</div> 
</div>

#p_box包括#p_cont,当点击#p_box区域任何位置时(包括#p_cont),都会触发a事件。想要阻止点击#p_cont区域时触发a事件,需要在#p_cont区域内加入阻止事件冒泡的代码。
变成
<div id="p_box" onclick="a()"> 
<div id="p_cont" onclick="stopBubble(this.id)"> 
</div> 
</div> 
function a(){ 
//这里是a事件的代码 
} 
function stopBubble(e) { 
if (e && e.stopPropagation) {//非IE浏览器 
e.stopPropagation(); 
} 
else {//IE浏览器 
window.event.cancelBubble = true; 
} 
}
Javascript 相关文章推荐
jquery ready函数源代码研究
Dec 06 Javascript
JavaScript设计模式之工厂方法模式介绍
Dec 28 Javascript
详谈javascript中的cookie
Jun 03 Javascript
AngularJS中如何使用$parse或$eval在运行时对Scope变量赋值
Jan 25 Javascript
JS中使用DOM来控制HTML元素
Jul 31 Javascript
js中数组的常用方法小结
Dec 30 Javascript
Vue.js实战之使用Vuex + axios发送请求详解
Apr 04 Javascript
javascript 初学教程及五子棋小程序的简单实现
Jul 04 Javascript
微信小程序实现文字跑马灯效果
May 26 Javascript
Vue表单类的父子组件数据传递示例
May 03 Javascript
了解ESlint和其相关操作小结
May 21 Javascript
代码实例ajax实现点击加载更多数据图片
Oct 12 Javascript
jquery 触发a链接点击事件解决方案
May 02 #Javascript
jQuery弹性滑动导航菜单实现思路及代码
May 02 #Javascript
js通过地址栏给action传值(中文乱码全是问号)
May 02 #Javascript
如何使用jQuery来处理图片坏链具体实现步骤
May 02 #Javascript
jQuery仿Excel表格编辑功能的实现代码
May 01 #Javascript
JavaScript 实现类的多种方法实例
May 01 #Javascript
Json字符串转换为JS对象的高效方法实例
May 01 #Javascript
You might like
PHP图片处理之使用imagecopyresampled函数实现图片缩放例子
2014/11/19 PHP
yii2实现根据时间搜索的方法
2016/05/25 PHP
PHP 文件上传后端处理实用技巧方法
2017/01/06 PHP
基于PHP常用文件函数和目录函数整理
2017/08/17 PHP
10个基于jQuery或JavaScript的WYSIWYG 编辑器整理
2010/05/06 Javascript
让innerText在firefox火狐和IE浏览器都能用的写法
2011/05/14 Javascript
用js实现控件的隐藏及style.visibility的使用
2013/06/14 Javascript
浅析JavaScript基本类型与引用类型
2014/05/28 Javascript
一个JavaScript防止表单重复提交的实例
2014/10/21 Javascript
JavaScript变量声明详解
2014/11/27 Javascript
jQuery实现ichat在线客服插件
2014/12/29 Javascript
JQuery工具函数汇总
2015/06/15 Javascript
jQuery获取页面及个元素高度、宽度的总结——超实用
2015/07/28 Javascript
理解jquery事件冒泡
2016/01/03 Javascript
ionic cordova一次上传多张图片(类似input file提交表单)的实现方法
2016/12/16 Javascript
使用puppeteer破解极验的滑动验证码
2018/02/24 Javascript
vue移动UI框架滑动加载数据的方法
2018/03/12 Javascript
通过 JS 判断页面是否有滚动条的实现方法
2018/04/05 Javascript
node版本管理工具n包使用教程详解
2018/11/09 Javascript
Vue中qs插件的使用详解
2020/02/07 Javascript
python中的内置函数getattr()介绍及示例
2014/07/20 Python
python利用datetime模块计算时间差
2015/08/04 Python
python 使用get_argument获取url query参数
2017/04/28 Python
python如何派生内置不可变类型并修改实例化行为
2018/03/21 Python
Selenium 模拟浏览器动态加载页面的实现方法
2018/05/16 Python
pandas中apply和transform方法的性能比较及区别介绍
2018/10/30 Python
python登录WeChat 实现自动回复实例详解
2019/05/28 Python
Python转换时间的图文方法
2019/07/01 Python
基于jupyter代码无法在pycharm中运行的解决方法
2020/04/21 Python
Django框架请求生命周期实现原理
2020/11/13 Python
印度最大的旅游网站:MakeMyTrip
2016/10/05 全球购物
SQL Server笔试题
2012/01/10 面试题
俄罗斯商务邀请函
2014/01/26 职场文书
爱心捐助活动总结
2015/05/09 职场文书
美丽心灵观后感
2015/06/01 职场文书
Python Pandas数据分析之iloc和loc的用法详解
2021/11/11 Python