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> ...
随机推荐
- virtualenv下配置nginx uwsgi Django
1.安装virtualenv,创建虚拟环境django15 sudo apt-get install virtualenv virtualenv env source bin/active pip i ...
- Android--应用开发1（应用程序框架）
应用程序的框架,就是所有开发者共同是有和遵循的约定,大家在约定上进行必要的扩展,但程序的主体结构是一致的. Android系统提供给开发者一个框架,我们所有的应用开发就是在这个框架上进行扩展,下来看看 ...
- fileupload控件上传、文件下载
常遇到上传下载的功能,这里把我习惯的用法写下来: 上传: string fileName = "";fileName = this.fu_pic.FileName;if (stri ...
- 四、XML映射配置文件
MyBatis的XML配置文件包含了影响MyBatis行为甚深的设置和属性信息.XML文档的高层级结构如下: ----configuration配置 --------properties属性 ---- ...
- 【剪枝】HDU 1010——tempter of the bone
来源:点击打开链接 看上去数据规模很小,但是必须要剪枝,否则直接爆TLE. 通过这个题可以练习奇偶剪枝. 另外:还有一个优化方式,如果所有步数走完了门还没关,则直接返回结果"NO" ...
- UML 2中结构图的介绍
原文: http://www.ibm.com/developerworks/cn/rational/rationaledge/content/feb05/bell/ 这是关于统一建模语言.即UML 里 ...
- os4开始CLLocationManager类中不支持locationServicesEnabled属性了
locationServicesEnabled改为类方法 //判断定位服务是否开启 if ([CLLocationManager locationServicesEnabled]) { }
- mysql 服务器ip连接统计
有的时候数据库服务器连接数过大,也没有慢sql,想知道哪些应用服务器连接上来的比较多,下面的命令轻松搞定 netstat -tnp|grep ESTABLISHED|awk '{ print $5 } ...
- CentOS下挂载U盘
插入U盘提示: [sdb] No Caching mode page present [sdb] Assuming drive cache: write through 再用fdisk -l 来查看U ...
- android112 c代码打印日志，c反编译调用java
activity: package com.itheima.ccalljava; import android.os.Bundle; import android.app.Activity; impo ...