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


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当鼠标悬停时放大图片的效果实例
Jul 03 Javascript
js事件绑定快捷键以ctrl+k为例
Sep 30 Javascript
javascript弹性运动效果简单实现方法
Jan 08 Javascript
JS设计模式之惰性模式(二)
Sep 29 Javascript
自定义PC微信扫码登录样式写法
Dec 12 Javascript
详解webpack中的hash、chunkhash、contenthash区别
Jan 05 Javascript
Vue数据驱动表单渲染,轻松搞定form表单
Jul 19 Javascript
解析原来浏览器原生支持JS Base64编码解码
Aug 12 Javascript
vue Tab切换以及缓存页面处理的几种方式
Nov 05 Javascript
关于angular浏览器兼容性问题的解决方案
Jul 26 Javascript
解决vuecli3中img src 的引入问题
Aug 04 Javascript
解决Vue-cli3没有vue.config.js文件夹及配置vue项目域名的问题
Dec 04 Vue.js
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程序员编程注意事项
2008/04/10 PHP
php实现获取文章内容第一张图片的方法
2014/11/04 PHP
thinkphp3.x中cookie方法的用法分析
2016/05/19 PHP
php模仿qq空间或朋友圈发布动态、评论动态、回复评论、删除动态或评论的功能(中)
2017/06/11 PHP
PHP重置数组为连续数字索引的几种方式总结
2018/03/12 PHP
PHP7 新增功能
2021/03/09 PHP
零基础学JavaScript最新动画教程+iso光盘下载
2008/01/22 Javascript
js 数组的for循环到底应该怎么写?
2010/05/31 Javascript
js实现点击添加一个input节点
2014/12/05 Javascript
JS实现动态给图片添加边框的方法
2015/04/01 Javascript
浅谈Javascript的静态属性和原型属性
2015/05/07 Javascript
jQuery模拟原生态App上拉刷新下拉加载更多页面及原理
2015/08/10 Javascript
学习JavaScript设计模式(接口)
2015/11/26 Javascript
js实现上传文件添加和删除文件选择框
2016/10/24 Javascript
基于JS实现的随机数字抽签实例
2016/12/08 Javascript
JavaScript实现瀑布流以及加载效果
2017/02/11 Javascript
js使用ajax传值给后台,后台返回字符串处理方法
2018/08/08 Javascript
jQuery动态生成的元素绑定事件操作实例分析
2019/05/04 jQuery
Typescript的三种运行方式(小结)
2019/09/18 Javascript
JavaScript枚举选择jquery插件代码实例
2020/11/17 jQuery
Python实现多线程下载文件的代码实例
2014/06/01 Python
python进阶教程之模块(module)介绍
2014/08/30 Python
在Python中用get()方法获取字典键值的教程
2015/05/21 Python
浅谈pytorch grad_fn以及权重梯度不更新的问题
2019/08/20 Python
python实现将一维列表转换为多维列表(numpy+reshape)
2019/11/29 Python
用python解压分析jar包实例
2020/01/16 Python
flask框架自定义url转换器操作详解
2020/01/25 Python
python range实例用法分享
2020/02/06 Python
Python 改变数组类型为uint8的实现
2020/04/09 Python
Python paramiko使用方法代码汇总
2020/11/20 Python
html5 实现客户端验证上传文件的大小(简单实例)
2016/05/15 HTML / CSS
党员批评与自我批评
2014/02/12 职场文书
取保候审保证书
2014/04/30 职场文书
会计试用期自我评价
2015/03/10 职场文书
社区公民道德宣传日活动总结
2015/03/23 职场文书
HTML中的表单元素介绍
2022/02/28 HTML / CSS