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


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 相关文章推荐
js 获取计算后的样式写法及注意事项
Feb 25 Javascript
js作用域及作用域链概念理解及使用
Apr 15 Javascript
js的匿名函数使用介绍
Dec 11 Javascript
分享一则javascript 调试技巧
Jan 02 Javascript
js变形金刚文字特效代码分享
Aug 20 Javascript
jquery实现动画菜单的左右滚动、渐变及图形背景滚动等效果
Aug 25 Javascript
基于jQuery Tipso插件实现消息提示框特效
Mar 16 Javascript
解析如何利用iframe标签以及js制作时钟
Dec 08 Javascript
jquery利用json实现页面之间传值的实例解析
Dec 12 Javascript
Vue.js划分组件的方法
Oct 29 Javascript
微信小程序实现流程进度的图样式功能
Jan 16 Javascript
Vue的事件响应式进度条组件实例详解
Feb 04 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
《忧国的莫里亚蒂》先导宣传图与STAFF公开
2020/03/04 日漫
曾在DC漫画界反派角色扮演的演员,谁才是你心目中的小丑之王?
2020/04/09 欧美动漫
php中cookie的作用域
2008/03/27 PHP
PHP+Mysql+jQuery实现发布微博程序 jQuery篇
2011/10/08 PHP
php漏洞之跨网站请求伪造与防止伪造方法
2013/08/15 PHP
Laravel执行migrate命令提示:No such file or directory的解决方法
2016/03/16 PHP
php 使用html5 XHR2实现上传文件与进度显示功能示例
2020/03/03 PHP
JS模拟的QQ面板上的多级可展开的菜单
2009/10/10 Javascript
jquery中实现简单的tabs插件功能的代码
2011/03/02 Javascript
浅析Prototype的模板类 Template
2011/12/07 Javascript
Windows8下搭建Node.js开发环境教程
2014/09/03 Javascript
jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
2016/01/19 Javascript
JS使用onerror捕获异常示例
2016/08/03 Javascript
Node.js配合node-http-proxy解决本地开发ajax跨域问题
2016/08/31 Javascript
Bootstrap 模态框实例插件案例分析
2016/12/28 Javascript
node跨域请求方法小结
2017/08/25 Javascript
小程序实现列表删除功能
2018/10/30 Javascript
如何用RxJS实现Redux Form
2018/12/29 Javascript
layui--select使用以及下拉框实现键盘选择的例子
2019/09/24 Javascript
解决vue的router组件component在import时不能使用变量问题
2020/07/26 Javascript
Python查找相似单词的方法
2015/03/05 Python
Python 类的继承实例详解
2017/03/25 Python
Python 装饰器使用详解
2017/07/29 Python
Python3.5 Json与pickle实现数据序列化与反序列化操作示例
2019/04/29 Python
python实现飞机大战小游戏
2019/11/08 Python
基于python及pytorch中乘法的使用详解
2019/12/27 Python
Django ValuesQuerySet转json方式
2020/03/16 Python
完美解决IE8下不兼容rgba()的问题
2017/03/31 HTML / CSS
迟到检讨书1000字
2014/01/15 职场文书
校园摄影活动策划方案
2014/02/05 职场文书
护士上岗前培训自我鉴定
2014/04/20 职场文书
学习雷锋活动总结
2014/04/29 职场文书
个人四风问题整改措施
2014/10/24 职场文书
800字作文之大雪
2019/12/04 职场文书
python 如何获取页面所有a标签下href的值
2021/05/06 Python
8个JS的reduce使用实例和reduce操作方式
2021/10/05 Javascript