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. 通过Java Api与HBase交互(转)

    HBase提供了Java Api的访问接口,掌握这个就跟Java应用使用RDBMS时需要JDBC一样重要,本文将继续前两篇文章中blog表的示例,介绍常用的Api. import java.io.IO ...

  2. 【解决】SharePoint外部列表保存的日期/时间值不正确

    [问题描述]: 在SharePoint中创建一个外部列表后,通过工作流或直接通过外部列表中的新增向外部列表添加数据项.通过外部列表或数据库查看添加的数据项时发现日期类型字段的值都不正确,像是差了若干个 ...

  3. C++设计模式-AbstractFactory抽象工厂模式

    AbstractFactory 要创建一组相关或者相互依赖的对象 作用:提供一个创建一系列相关或相互依赖对象的接口,而无需指定它们具体的类. UML结构图: 抽象基类: 1)AbstractProdu ...

  4. Range-Based for Loops

    for ( decl : coll ) { statement } where decl is the declaration of each element of the passed collec ...

  5. 10.11 安装pod

    原文地址:http://www.jianshu.com/p/5fc15906c53a  感谢. 更新升级10.11 cocoapods安装出问题最简单的解决方法 这是因为10.11把cocoapods ...

  6. JQuery的Ajax跨域请求原理概述及实例

    今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发 JQuer ...

  7. [js]识别浏览器及版本

    var userAgent = navigator.userAgent.toLowerCase();window.jQuery.browser = {    version: (userAgent.m ...

  8. JavaScript执行bat文件清理浏览器缓存

    function exec() { window.onerror = function (err) { if (err.indexOf('utomation') != -1) { alert('命令已 ...

  9. React子组件与父组件传值

    一 子组件向父组件传值 //子组件var Child = React.createClass({ render: function(){ return ( <div> 请输入邮箱:< ...

  10. HeartBeat的一些介绍和功能上的一些总结

    HeartBeat的作用: 通过HeartBeat,可以将资源(IP以及程序服务等资源)从一台已经故障的计算机快速转移到另一台正常运转的机器上继续提供服务,一般称之为高可用的服务.在实际的生产应用场景 ...