方式一：event.stopPropagation();

方式二：return false;

但是这两种方式是有区别的。return false 不仅阻止了事件往上冒泡，而且阻止了事件本身。event.stopPropagation() 则只阻止事件往上冒泡，不阻止事件本身。

例子： 当文本输入框获取焦点后，在div1的mousedown事件中采用 event.stopPropagation(); 代码，我们鼠标单击红色区域后文本输入框光标失去。而当我们使用 return false; 代码时，鼠标单击红色区域光标仍然停留在文本输入框内。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="jquery-1.12.3.min.js"></script>
<script>
    $(document).ready(function(){
        $("#div1").mousedown(function(event){
            //event.stopPropagation();
            return false;
        });
        $("#div2").mousedown(function(event){
            alert("trigger mousedown event of rootDiv");
        });
    });
</script>
</head>
<body>
    <div id="rootDiv" style="position:relative;left:400px;top:200px;">
        <div>1.单击输入框，使输入框获取焦点：</div>
        <input id="input1" style="width:250px;" type="text"></input>
        <div id="div2">
            <div id="div1" style="width:200px;height:200px;"><br><br>2.然后再单击这里</div>
        </div>
    </div>
</body>
</html>

jQuery中两种阻止事件冒泡的区别的更多相关文章

  1. Cesium 中两种添加 model 方法的区别

    概述 Cesium 中包含两种添加 model 的方法,分别为: 通过 viewer.entities.add() 函数添加 通过 viewer.scene.primitives.add() 函数添加 ...

  2. JQuery中阻止事件冒泡的两种方式及其区别

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

  3. JQuery 提供了两种方式来阻止事件冒泡。

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

  4. JQuery中阻止事件冒泡方式及其区别

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

  5. 阻止事件冒泡两种方式：event.stopPropagation();和return false;

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

  6. js阻止事件冒泡的两种方法

    1.什么是JS事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这 ...

  7. jquery阻止事件冒泡的3种方式

    第一种:return false, 缺点:直接返回了函数,函数后面的语句没法执行了: $('.btn').on('click',function(event){ do something ... re ...

  8. JQuery阻止事件冒泡

    冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. 我们在平时的开发过程中,肯定会遇到在一个div(这个div可以是元素)包裹一个div的情况,但是呢,在这两个div上都添加了事件,如果点 ...

  9. js阻止冒泡及jquery阻止事件冒泡示例介绍

    js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容. 复制代码 代码如下: function stopPro(evt){ var e = evt || window ...

随机推荐

  1. Android 打造自己的个性化应用(五)：仿墨迹天气实现续--> 使用Ant实现zip/tar的压缩与解压

    上一篇中提到对于Zip包的解压和压缩需要借助Ant 实现,我经过参考了其他的资料,整理后并加上了一些自己的看法: 这里就具体地讲下如何使用Ant进行解压缩及其原因: java中实际是提供了对  zip ...

  2. 15. SSH 远程

    一.原理:     使用SSH连接Centos时,我们可以创建一个公钥和一个私钥,公钥放在服务端,私钥放在客户端,当客户端去连接服务端时,会先去查找密钥,     要是客户端的私钥可以和服务端的公钥匹 ...

  3. App签名--- Android

    步骤: 下面就Next即可

  4. 使用DataReader读取数据

    List<User> allUsers = new List<User>(); SqlConnection conn = new SqlConnection(连接字符串); S ...

  5. TRI 解题报告

    题目大意: 在一个平面上有N(N <= 1000)个点,其中任意三点不共线,求这些点组成的三角形的面积和每和三角形内部含的点数的个数和. 数据范围: 20%的数据 N <= 50, 30% ...

  6. MFC之树控件

    树控件对应的类: CTreeControl 树控件属性设置: 启用复选框:Check Boxes = True 父节点显示+-按钮:Has Button = True ; Lines At Roots ...

  7. (原+转)Ubuntu下安装understand及在启动器中增加快捷方式

    参考网址: http://www.xuebuyuan.com/1353431.html http://www.2cto.com/os/201309/242543.html http://my.osch ...

  8. php-app开发接口加密

    自己平时工作中用到的一套接口加密规则,记录下来以后用: /** 2 inc 3 解析接口 客户端接口传输规则: 1.用cmd参数(base64)来动态调用不同的接口,接口地址统一为 http://a. ...

  9. [Head First Python]2. python of comment

    1- 多行注释 ''' ''' 或 """ """ '''this is the standard way to include a mul ...

  10. 【转】实战Nginx与PHP（FastCGI）的安装、配置与优化

    原文连接:http://ixdba.blog.51cto.com/2895551/806622 原文作者:南非蚂蚁 转载注明以上信息 一.什么是 FastCGIFastCGI是一个可伸缩地.高速地在H ...