阻止冒泡
来源:互联网 发布:取消iphone不安全网络 编辑:程序博客网 时间:2024/06/04 20:42
之前一直对冒泡一知半解 今天就去看了一下
<body > <div class="content"> 外层div元素 <span>内层span元素</span> </div> <div class="msg"></div></body>
比如上面这段代码:
给 span div body 都加上click事件以后 当点击span的时候 却也会触发到div以及body的事件
这种就是冒泡
$(function(){ $('span').bind("click",function(){ var txt = $(".msg").html()+"<p>内层span元素被击中</p>"; $(".msg").html(txt); }); $('.content').bind("click",function(){ var txt = $(".msg").html()+"<p>外层div元素被击中</p>"; $(".msg").html(txt); }); $('body').bind("click",function(){ var txt = $(".msg").html()+"<p>body元素被击中</p>"; $(".msg").html(txt); });})
上面这段就会造成事件冒泡 那要怎么阻止事件冒泡呢
jQuery里面有一个stopPropagation() 就是阻止时间冒泡的方法
前提是我们需要添加一个事件对象 这样可以再事件处理函数的时候访问到
$('span').bind("click",function(event){ var txt = $(".msg").html()+"<p>内层span元素被击中</p>"; $(".msg").html(txt); event.stopPropagation(); });
这样以后 就成功地阻止了时间冒泡
0 0
- 阻止冒泡
- 阻止冒泡
- 阻止冒泡
- js阻止冒泡 jquery阻止冒泡
- VUE冒泡及阻止冒泡
- javascript阻止冒泡事件
- 阻止冒泡事件
- Js 冒泡事件阻止
- jQuery阻止冒泡
- jQuery阻止事件冒泡
- 阻止js事件冒泡
- Jquery 阻止事件冒泡
- jquery 阻止冒泡
- JS阻止事件冒泡
- 阻止事件冒泡
- JS阻止事件冒泡
- js阻止冒泡
- javascript阻止事件冒泡
- 欢迎使用CSDN-markdown编辑器
- OkHttp的POST、GET请求方式
- Oracle中子查询
- 【洛谷】 P1420 最长连号
- 关于微信支付无法跳转支付页面问题
- 阻止冒泡
- android 开发随记
- DoTween使用方法(1)
- 比较通用的 stdafx.h 源码
- Qt5.7中文乱码解决
- 用户空间和内核空间通讯之【Netlink 中】
- Java核心内库-线程-线程同步-同步方法
- Android 多线程-----AsyncTask详解
- 关于反射(一)