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


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 相关文章推荐
jqeury eval将字符串转换json的方法
Jan 20 Javascript
JS 实现列表与多选框选择附预览动画
Oct 29 Javascript
在JavaScript中操作时间之getMonth()方法的使用
Jun 10 Javascript
日常收藏的jquery技巧
Dec 02 Javascript
使用Bootstrap Tabs选项卡Ajax加载数据实现
Dec 23 Javascript
Bootstrap中datetimepicker使用小结
Dec 28 Javascript
js实现以最简单的方式将数组元素添加到对象中的方法
Dec 20 Javascript
angular1配合gulp和bower的使用教程
Jan 19 Javascript
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
详解redux异步操作实践
Aug 15 Javascript
vue-cli3.0使用及部分配置详解
Aug 29 Javascript
JavaScript实现五子棋小游戏
Oct 26 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数组函数序列之array_sum() - 计算数组元素值之和
2011/10/29 PHP
PHP内核探索:变量概述
2014/01/30 PHP
php检测apache mod_rewrite模块是否安装的方法
2015/03/14 PHP
关于php unset对json_encode的影响详解
2018/11/14 PHP
PHP PDOStatement::closeCursor讲解
2019/01/30 PHP
实例讲解PHP表单验证功能
2019/02/15 PHP
javascript 获取所有id中包含某关键字的控件的实现代码
2010/11/25 Javascript
javascript开发技术大全-第3章 js数据类型
2011/07/03 Javascript
js导出table数据到excel即导出为EXCEL文档的方法
2013/10/10 Javascript
使用nodejs、Python写的一个简易HTTP静态文件服务器
2014/07/18 NodeJs
了不起的node.js读书笔记之例程分析
2014/12/22 Javascript
JavaScript常用脚本汇总(一)
2015/03/04 Javascript
JS清除文本框内容离开在恢复及鼠标离开文本框时触发js的方法
2016/01/12 Javascript
深入理解JavaScript程序中内存泄漏
2016/03/17 Javascript
js enter键激发事件实例代码
2016/08/17 Javascript
Vue.js快速入门教程
2016/09/07 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
微信小程序 增、删、改、查操作实例详解
2017/01/13 Javascript
详解React开发中使用require.ensure()按需加载ES6组件
2017/05/12 Javascript
探讨Vue.js的组件和模板
2017/10/27 Javascript
JS运动特效之完美运动框架实例分析
2018/01/24 Javascript
React如何避免重渲染
2018/04/10 Javascript
微信小程序webview组件交互,内联h5页面并网页实现微信支付实现解析
2019/08/16 Javascript
vue + elementUI实现省市县三级联动的方法示例
2019/10/29 Javascript
[01:32]DOTA2次级联赛——首支职业女子战队选拔赛全记录
2014/10/23 DOTA
Python3字符串学习教程
2015/08/20 Python
详解Python中类的定义与使用
2017/04/11 Python
通过python 执行 nohup 不生效的解决
2020/04/16 Python
pytorch 实现L2和L1正则化regularization的操作
2021/03/03 Python
DNA基因检测和分析:23andMe
2019/05/01 全球购物
大学辅导员事迹材料
2014/02/05 职场文书
个人合作协议书范本
2014/04/18 职场文书
创业计划书之香辣虾火锅
2019/09/23 职场文书
什么是动态刷新率DRR? Windows11动态刷新率功能介绍
2021/11/21 数码科技
JavaWeb Servlet开发注册页面实例
2022/04/11 Java/Android
详细介绍python操作RabbitMq
2022/04/12 Python