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


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 相关文章推荐
在IE中调用javascript打开Excel的代码(downmoon原作)
Apr 02 Javascript
javascript实现五星评价代码(源码下载)
Aug 11 Javascript
javascript日期格式化方法小结
Dec 17 Javascript
jQuery插件echarts实现的多折线图效果示例【附demo源码下载】
Mar 04 Javascript
将angular-ui的分页组件封装成指令的方法详解
May 10 Javascript
Bootstrap + AngularJS 实现简单的数据过滤字符查找功能
Jul 27 Javascript
Vue项目全局配置页面缓存之按需读取缓存的实现详解
Aug 01 Javascript
微信小程序自定义可滑动顶部TabBar选项卡实现页面切换功能示例
May 14 Javascript
js设置鼠标悬停改变背景色实现详解
Jun 26 Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 Javascript
vue-router 控制路由权限的实现
Sep 24 Javascript
利用前端HTML+CSS+JS开发简单的TODOLIST功能(记事本)
Apr 13 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入门小知识
2008/03/24 PHP
php mssql 时间格式问题
2009/01/13 PHP
php 伪造本地文件包含漏洞的代码
2011/11/03 PHP
php实现数组中索引关联数据转换成json对象的方法
2015/07/08 PHP
常用PHP封装分页工具类
2017/01/14 PHP
完美解决php 导出excle的.csv格式的数据时乱码问题
2017/02/18 PHP
JQuery中getJSON的使用方法
2010/12/13 Javascript
Javascript中 关于prototype属性实现继承的原理图
2013/04/16 Javascript
不使用浏览器运行javascript代码的方法
2013/07/24 Javascript
使用jquery获取网页中图片高度的两种方法
2013/09/26 Javascript
jQuery使用andSelf()来包含之前的选择集
2014/05/19 Javascript
jQuery插件开发详细教程
2014/06/06 Javascript
JSON格式化输出
2014/11/10 Javascript
详解javascript实现瀑布流列式布局
2016/01/29 Javascript
深入php面向对象、模式与实践
2016/02/16 Javascript
JavaScript中setTimeout的那些事儿
2016/11/14 Javascript
浅谈JavaScript正则表达式-非捕获性分组
2017/03/08 Javascript
基于vue2框架的机器人自动回复mini-project实例代码
2017/06/13 Javascript
jQuery实现倒计时功能 jQuery实现计时器功能
2017/09/19 jQuery
vue-router history模式下的微信分享小结
2018/07/05 Javascript
探秘vue-rx 2.0(推荐)
2018/09/21 Javascript
微信小程序常用简易小函数总结
2019/02/01 Javascript
使用localStorage替代cookie做本地存储
2019/09/25 Javascript
详解Vue.js 作用域、slot用法(单个slot、具名slot)
2019/10/15 Javascript
详解vue 中 scoped 样式作用域的规则
2020/09/14 Javascript
深入了解Vue动态组件和异步组件
2021/01/26 Vue.js
Python程序设计入门(4)模块和包
2014/06/16 Python
让python同时兼容python2和python3的8个技巧分享
2014/07/11 Python
Python图算法实例分析
2016/08/13 Python
Python使用tkinter模块实现推箱子游戏
2019/10/08 Python
python计算auc的方法
2020/09/09 Python
python实现excel公式格式化的示例代码
2020/12/23 Python
意大利独特而优质的家居用品:Fazzini
2018/12/05 全球购物
产品陈列协议书(标准版)
2014/09/17 职场文书
带刀到教室的检讨书
2014/10/04 职场文书
Oracle中日期的使用方法实例
2022/07/07 Oracle