jQuery如何阻止子元素继承父元素事件？
<a>
<b></b>
</a>
$("a").click(...);
这种绑定的话，b也会响应一次事件，如何只对a元素绑定事件，而不对子元素绑定呢？即b被click之后自己并不触发回调函数，而是把事件传递给a。
我现在的做法是：直接在a上写 <a onclick="xxx"></a> ，这样b就不会把自己作为event.target触发回调了.
--- 更新 ----
大家可能对我的意思有误解，我不是要阻止事件冒泡，恰恰相反，我是要b在接受到click事件的时候直接把事件向上传递给a，就像我在代码里面指定的那样
---- 再次更新 ---
代码是这样的
$('a').click(function(evt){
var self = $(evt.target);
self.addClass('btn-primary');
});
这时候，如果点击了b， 那么b会被加上btn-primary这个class，但是我想点击了b，也只是给a添加 这个class，希望处理事件的对象是a，不是b
javascript 工作机制是这样的，当你点击内层的元素 b 时，首先浏览器会捕获这个事件，并定位当前的 DOM 元素，接下来采用冒泡机制，向上查找父元素，直到找到绑定了点击事件的元素 a 为止。
你是希望阻止这种冒泡还是什么呢？或者题主可以直接贴代码，再写需求。:)
你可以实现这么几个需求：
1.阻止事件冒泡，但不阻止默认行为。如 stopPropagation 或楼上用的 cancelBubble等。
2.阻止默认行为，但不阻止事件冒泡。如 preventDefault 方法。
3.同时阻止事件冒泡和默认行为。直接 return false 即可。
给b添加一个事件，里面禁止事件冒泡就行了 （这样也能消除父级对子级的影响）-->e.cancelBubble = true;
eg :
<script type="text/javascript">
function f1(e){
alert("你点击了一个链接");
//取消冒泡
e.cancelBubble = true;
}
function f2(e){
alert("你点击了一个DIV");
}
</script>
</head>
<body style="font-size:30px;">
<div onclick="f2(event);">
<a href="javascript:;" onclick="f1(event);">ClickMe</a>
</div>
</body>
jQuery如何阻止子元素继承父元素事件？的更多相关文章
- Javascript禁止子元素继承父元素的事件
3种方法1.在父元素事件的function中加if(event.target==this){ }2.子元素事件function最后加event.stopPropgation():// 阻止事件冒泡3. ...
- jquery如何阻止子元素继承父元素的事件（又称事件冒泡）
非常简单,子元素上添加如下代码即可 $('a').click(function(e){ e.stopPropagation(); }); 老版本为event,现在用e就行
- javascript阻止子元素继承父元素事件
$('.box').on('click', function (e) { if(e.target == this) { console.log(e.target) } })
- I do not want to inherit the child opacity from the parent in CSS(不想让子元素继承父元素的透明度)
Instead of using opacity, set a background-color with rgba, where 'a' is the level of transparency. ...
- jquery如何阻止子元素相应mouseout事件
jquery如何阻止子元素相应mouseout事件:mouseout有一个特点,当鼠标移入子元素的时候,也会触发此事件,但是在实际应用中这个特点往往不是我们想要的,下面就通过代码实例介绍一下如何实现此 ...
- jQuery学习笔记---兄弟元素、子元素和父元素的获取
我们这里主要总结jQuery中对某元素的兄弟元素.子元素和父元素的获取,原声的Javascript代码对这些元素的获取比较麻烦一些,而jQuery正好对这些方法进行封装,让我们更加方便的对这些元素进行 ...
- jQuery中兄弟元素、子元素和父元素的获取
我们这里主要总结jQuery中对某元素的兄弟元素.子元素和父元素的获取,原声的Javascript代码对这些元素的获取比较麻烦一些,而jQuery正好对这些方法进行封装,让我们更加方便的对这些元素进行 ...
- 一个 VUE 组件：实现子元素 scroll 父元素容器不跟随滚动（兼容PC、移动端）
介绍 我们经常遇到一种情况.当滑动滚动条区域时,子元素滚动条到底部或顶部时就会触发父级滚动条,父级滚动条同理会继续向上触发,直至body容器.这是浏览器默认的滚动行为. 但是很多情况,我们想要子元素滚 ...
- WPF XMAL获取元素的父元素，子元素
/// 获得指定元素的父元素 /// </summary> /// <typeparam name="T">指定页面元素</typeparam> ...
随机推荐
- 问题-Delphi为什么不能连接oracle
问题现象:delphi 为什么不能连接oracle 问题处理:加一句OraSession1.Options.Net := True;
- HDU 4452 Running Rabbits （模拟题）
题意: 有两只兔子,一只在左上角,一只在右上角,两只兔子有自己的移动速度(每小时),和初始移动方向. 现在有3种可能让他们转向:撞墙:移动过程中撞墙,掉头走未完成的路. 相碰: 两只兔子在K点整(即处 ...
- T-SQL语句查看作业等信息
因服务器需要迁移,需要将现有JOB迁移至新服务器,待服务器调整完毕,则重新迁移到原服务器,所以在做迁移之前希望将现有JOB进行备份,不至于乱了执行时间.1.查看所有作业列表USE master SEL ...
- void,extern,sizeof
高手潜规则:禁用goto 程序质量与goto出现次数成反比 void指针的意义 1.C语言规定只有相同类型的指针才可以相互赋值 2.void*指针作为坐值用于"接收"任意类型的指针 ...
- javascript中使用md5函数
javascript中使用md5函数 这对于js来讲本来是没有的,现在可以自己定义一个md5的函数,达到加密效果. var hexcase = 0; function hex_md5(a) { if ...
- 网络爬虫之Windows环境Heritrix3.0配置指南
一.引言: 最近在忙某个商业银行的项目,需要引入外部互联网数据作为参考,作为技术选型阶段的工作,之前已经确定了中文分词工具,下一个话题就是网络爬虫的选择,目标很明确,需要下载一些财经网站的新闻信息,然 ...
- IOS开发UIImage中stretchableImageWithLeftCapWidth方法的解释
- (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCap ...
- iOS开发中懒加载的使用和限制
1.在开发过程中很多时候,很多控件和对象需要alloc为了,提高开发效率使得懒加载得以产生. 2.下边用代码解释: - (NSMutableArray *)newsArr{ if (!_newsArr ...
- 剖析iphone之触摸事件touchstart
今天做项目发现一个问题,貌似从前没有遇到过,就记录一下,以后方便看.....(代码只显示了js这部分 样式结构都会写) 一般我们绑定click触发事件都是直接用onclick 或者方便一点click, ...
- ubuntu安装日志
默认 桌面有2个文档 一个是示例,我们选择 开始安装Ubuntu 14.10 LTS , 记得在这之前 要按Ctrl+Alt+T 打开终端,输入代码:sudo umount -l /isodevice ...