e.stopPropagation();与 e.preventDefault();
e.stopPropagation()阻止事件冒泡
<head>
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
</head>
<body>
<table>
<tr>
<td><span>冒泡事件测试</span></td>
</tr>
</table>
</body>
我们先看这段代码：
<script type="text/javascript">
$(function () {
$("table").click(function () { alert("table alert"); });
$("td").click(function () { alert("td alert"); });
$("span").click(function (){
alert("span alert");
});
});
</script>
我们会看到这样的情况：span alert -> td alert -> table alert。这就叫事件冒泡。就是从下到上，从里到外，事件依次触发。
有的时候我们不希望事件冒泡咋办？
<script type="text/javascript">
$(function () {
$("table").click(function () { alert("table alert"); });
$("td").click(function () { alert("td alert"); });
$("span").click(function (e){
alert("span alert");
e.stopPropagation();
});
});
</script>
如果想获得事件相关信息，就要给匿名方法加一个e对象，e就是事件对象。 e.preventDefault()阻止事件默认行为。 $("a").click(function (e) {
alert("默认行为被禁止喽");
e.preventDefault();
});
<a href="http://www.baidu.com">测试</a> return false等效于同时调用e.preventDefault()和e.stopPropagation() return false除了阻止默认行为之外，还会阻止事件冒泡。如果手上有一份jquery源代码的话，可查看其中有如下代码：
if (ret===false){
event.preventDefault();
event.stopPropagation();
}
顶
e.stopPropagation();与 e.preventDefault();的更多相关文章
- 阻止事件冒泡，阻止默认事件，event.stopPropagation()和event.preventDefault()，return fal的区别
今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时 ...
- JS 之 阻止事件冒泡，阻止默认事件，event.stopPropagation()和event.preventDefault()，return false的区别
在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生. 一.event.stopPropagation() 阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时 ...
- event.stopPropagation()，event.preventDefault()和return false的区别
event.stopPropagation(),event.preventDefault()和return false的区别 1.event.stopPropagation()方法 这是阻止事件的冒泡 ...
- 阻止事件冒泡，阻止默认事件，event.stopPropagation()和event.preventDefault()，return false的区别
1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...
- event.stopPropagation()和event.preventDefault()
1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...
- event.stopPropagation()和event.preventDefault()，return false的区别
我写公司的官网遇到一个问题,轮播图的上一层有一块内容,用鼠标拖动那块内容的时候下一层的轮播图也会跟着拖动,而上面的那层的内容是不会动的,我想这就是冒泡事件在作祟了吧 跟冒泡事件相关的,我想到三个: 1 ...
- vue 中 event.stopPropagation() 和event.preventDefault() 使用
1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向document上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开 ...
- event.stopPropagation()与event.preventDefault()
<div id='div0'> <div id='div1'> <a href="#" id='div2'>2222</a> < ...
- event.stopPropagation与event.preventDefault的区别
1.event.stopPropagation 停止事件的传播,阻止它被分配到其它Dom节点.但是不能阻止同一Dom节点上的其它事件句柄被调用. 注:不同Dom节点的事件必须是一致的.如父节点和子节点 ...
随机推荐
- SQL Server调优系列基础篇（索引运算总结）
前言 上几篇文章我们介绍了如何查看查询计划.常用运算符的介绍.并行运算的方式,有兴趣的可以点击查看. 本篇将分析在SQL Server中,如何利用先有索引项进行查询性能优化,通过了解这些索引项的应用方 ...
- 关于 redis、memcache mongoDB 的对比
from:http://yang.u85.us/memcache_redis_mongodb.pdf 从以下几个维度,对 redis.memcache.mongoDB 做了对比.1.性能都比较高,性能 ...
- Linux 下安装配置 JDK
JDK 下载地址 http://www.oracle.com/technetwork/java/javase/downloads/index.html 按照自己的情况选择不同的版本下载 cd /usr ...
- service postgresql initdb [FAILED]
一.场景 安装postgresql时可能因为配置有问题[后来定位问题是我把pg_hba.conf中local一栏的ident修改为peer就会出错]导致服务起不来,报错如下: [root@localh ...
- ARM学习篇 中断定时理解
1. 中断控制器 a. 中断处理流程 P1--摘自S3C2440A手册 P1简要阐述了S3C2440A内置中断控制器处理中断的流程: ●若某中断有自中断,则先接收子中断请求,否则,直接接受源中断. ...
- Beyond IT
Know Yourself <开讲啦> 20160306 潘建伟:探索的动机
- NOIP2014飞扬的小鸟[DP][WRONG]
坑人啊朴素的dp 75分 用了完全背包才是80分,结果普遍偏小 为什么啊啊啊啊啊 等以后再写一遍吧 #include<iostream> #include<cstdio> #i ...
- Prefab Assist插件
资料 Prefab文档: http://game.ceeger.com/Manual/Prefabs.html 基础:基于NGUI制作组件的Prefab 前言 在一个游戏的UI中,有一些通用的组件,比 ...
- Java MyEclipse下Ant build.xml简单实例详解
一.下载配置ant 1.首先下载ant: http://www.apache.org/ 下载最新的版本2.解压ant 后设置ANT_HOME, PATH中添加ANT_HOME目录下的bin目录(如:A ...
- Apache和Tomcat区别
Apache 和 Tomcat 都是web网络服务器,两者既有联系又有区别,在进行HTML.PHP.JSP.Perl等开发过程中,需要准确掌握其各自特点,选择最佳的服务器配置.Apache是web服务 ...