1.阻止默认行为:通常是值一个标签的默认行为,如button的提交表单,a标签的跳转等。

那如何阻止标签的默认行为?

  1)return false

  2) e.preventDefault();

<!DOCTYPE html>
<html>
<head>
<title>queue</title>
<meta charset="utf-8">
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<!-- 设置五幅图片 -->
<div> <a class="a1" href="http://www.baidu.com">百度入口一(被阻止)</a>
<a class="a2" href="http://www.baidu.com">百度入口二(可使用)</a> </div>
<script type="text/javascript">
$(function(){
$('.a1').click(function(e){
//return false;
e.preventDefault();
});
})
</script>
</body>
</html>

其中return false不仅阻止默认行为还会阻止冒泡。

2.阻止事件冒泡

事件冒泡是指如果子元素与父元素或者祖先元素包含同样的事件,如click等,当点击子元素时,父元素上的点击事件也会触发。

阻止时间冒泡的方法:

  1)return false

  2)e.stoppropagation();

<!DOCTYPE html>
<html>
<head>
<title>queue</title>
<meta charset="utf-8">
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body> <div class="div3">
div3
<div class="div2">
div2
<div class="div1">div1</div>
</div>
</div> <script type="text/javascript">
$(function(){
$('div').click(function(e){
alert(e.target.className);
e.stopPropagation();
//return false; });
})
</script>
</body>
</html>

总结:return false会阻止事件冒泡和默认行为

   e.stopPropagation()只阻止事件冒泡;

   e.preventDefault()只阻止默认行为;

jQuery阻止默认行为和阻止冒泡的更多相关文章

  1. javascript的阻止默认事件和阻止冒泡事件

    这两个方面的知识,在妙味课堂中有听过,再次复习一下: 原文来自:[http://www.cnblogs.com/Essence/p/4266618.html] 事件冒泡与默认行为   在说事件冒泡之前 ...

  2. DOM2级事件对象、添加事件、阻止默认事件、阻止冒泡事件、获取事件对象目标的兼容处理

    事件对象——兼容处理 /* * 功能: 事件对象兼容 * 参数: 表示常规浏览器的事件对象e */ function getEvent(e) { // 如果存在e存在,直接返回,否则返回window. ...

  3. (O)阻止默认事件和阻止冒泡的应用场景

    场景1:阻止默认事件   比如这样的一个需求 点击取消a标签按钮的时候会触发一些js动作,但是不能让这个a标签产生跳转行为, 所以需要在点击取消的时候 阻止冒泡,防止其跳转. <a id='ca ...

  4. vue 事件修饰符(阻止默认行为和事件冒泡)

    1. 原生js中,阻止事件冒泡,获取点击对象, e.stopPropagation(); 2. vue阻止事件冒泡@click.stop="show" <body> & ...

  5. s事件之event.preventDefault()与event.stopPropagation()的阻止默认事件和阻止事件冒泡的用法

    event.preventDefault()用法介绍 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作).例如,如果 type 属性是 "submit" ...

  6. JQUERY中的事件处理:RETURN FALSE、阻止默认行为、阻止冒泡以及兼容性问题

    return false 在jQuery中,我们常用return false来阻止浏览器的默认行为,那"return false"到底做了什么? 当你每次调用"retur ...

  7. JS中阻止默认事件与事件冒泡

    JQuery 提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function(event){ ...

  8. js 停止事件冒泡 阻止浏览器的默认行为(阻止超连接 # )

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...

  9. js事件冒泡、阻止事件冒泡以及阻止默认行为

    事件冒泡 当事件发生后,这个事件就要开始传播(从里到外或者从外向里).为什么要传播呢?因为事件源本身(可能)并没有处理事件的能力,即处理事件的函数(方法)并未绑定在该事件源上.例如我们点击一个按钮时, ...

随机推荐

  1. C#:org.in2bits.MyXls 文本格式日期 转换,以及设置单元格格式,保留两位小数点

    org.in2bits.MyXls  Excel导入日期格式的处理 表格内容为 2014-7-22 ,导入后显示为 41842 等于一个数值,根本不是日期,后来百度了一下,发现要做如下处理: stri ...

  2. ruby中rsa加签解签方法

    # coding:utf-8require 'openssl'require 'base64'# rsa签名,文本内容和私钥路径def rsa_sign(data,private_key_path) ...

  3. WebApi:WebApi的Self Host模式

    不用IIS也能執行ASP.NET Web API 转载:http://blog.darkthread.net/post-2013-06-04-self-host-web-api.aspx 在某些情境, ...

  4. RMAN_学习笔记3_RMAN Catalog恢复目录

    2014-12-23 Created By BaoXinjian

  5. java中数据类型转换

    1.自动类型转换:首先两者数据类型要兼容,且目标类型要大于源类型如(int类型转换成double类型) 2.强制转换:两者数据类型要兼容,会使破坏数据的结构

  6. metasploit升级(BT5)

    1.apt-get update 2.apt-get install metasploit 3.修改文件:/opt/metasploit/ruby/lib/ruby/1.9.1/i686-linux/ ...

  7. 不让Win7休眠的设置

    1:原因 目前有一个项目是采用微服务的架构搭建的,其中一个微服务的数据库是在一位同事的电脑上(Win7系统),一旦这台电脑休眠,对应的数据库服务就访问不了,所以,需要保持此台电脑永不休眠. 2:傻瓜式 ...

  8. mvc之页面强类型

    为什么使用页面强类型: 一个页面只能定义 为一个强类型.因为 我们自己写@Html.TextBox("Qq"); 有可能写错,所以我们就在 编译阶段就把页当作一个类型然后使用lam ...

  9. c# winform TreeView NODE(节点) 重命名或获取节点修改后的值

    在程序开发过程中我们经常用到treeview,还经常要修改节点的名字.节点名字修改后还想及时更新数据库.这时问题就来了,怎样获取NODE(节点)更新后的值呢?本人试了很多方法最终分析出treeview ...

  10. java学习第5天

    一维数组完了就是二维数组,和一位数组类似 .我们定义二维数组用的是 int[] []arr=new int[m][n],与一维类似,它在堆内存中存放,并以地址的形式访问,如下图..   而遍历二维数组 ...