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();

}

来源：http://blog.csdn.net/woshixuye/article/details/7422985

jQuery中return false,e.preventDefault(),e.stopPropagation()的区别的更多相关文章

  1. jQuery js 中return false,e.preventDefault(),e.stopPropagation()的区别(事件冒泡)

    有时候遇到冒泡事件很烦人,真的..... 1.e.stopPropagation()阻止事件冒泡 <head> <title></title> <script ...

  2. jQuery中的 return false, e.preventDefault(), e.stopPropagation()的区别

    e.stopPropagation()阻止事件冒泡 <html><head>     <title></title>     <script sr ...

  3. jquery中return false的作用

    jquery中的return false既阻止默认事件,又阻止冒泡: 在原生的js中,return false只有一个功能,那就是阻止默认事件. <!DOCTYPE html> <h ...

  4. 关于js中return false、event.preventDefault()和event.stopPropagation()

    在平时项目中,如果遇到需要阻止浏览器默认行为,大家经常会用return false;和event.preventDefault()来阻止,但对它俩的区别还是有些一知半解,于是看了文档,查了些资料,在此 ...

  5. js中return false; jquery中需要这样写：return false(); Jquery 中循环 each的用法 for循环

    js中return false; jquery中需要这样写:return false(); Jquery 中循环 each的用法 $(".progressName").each(f ...

  6. js中 return false

    一.返回控制与函数结果, 语法为:return 表达式; 语句结束函数执行,返回调用函数,而且把表达式的值作为函数的结果  二.返回控制, 无函数结果,语法为:return;  在大多数情况下,为事件 ...

  7. js中return false，return，return true的使用方法及区别

    起首return作为返回keyword,他有下面两种返回体式格式 1.返回把握与函数成果 语法为:return 表达式; 语句停止函数履行,返回调用函数,而且把表达式的值作为函数的成果 2.返回把握无 ...

  8. js中return false,return,return true的用法及区别

    首先return作为返回关键字,他有以下两种返回方式 1.返回控制与函数结果 语法为:return 表达式; 语句结束函数执行,返回调用函数,而且把表达式的值作为函数的结果 2.返回控制无函数结果 语 ...

  9. js中return false，return，return true的用法及差别

    起首return作为返回关键字,他有以下两种返回体式格式 1.返回把握与函数成果 语法为:return 表达式; 语句停止函数履行,返回调用函数,并且把表达式的值作为函数的成果 2.返回把握无函数成果 ...

随机推荐

  1. 【Android】5.4 下拉框（Spinner）

    分类:C#.Android.VS2015: 创建日期:2016-02-07 下拉列表框Spinner的用法和WinForms中ComboBox的用法非常相似,在Android应用中使用频次也相当高,因 ...

  2. github初使用

    http://www.eoeandroid.com/thread-274556-1-1.html 其中编写 $ git remote add origin <a href="\&quo ...

  3. ClickAndMoveTest

    关于ccTouchesEnded看这个博客即可 http://blog.linguofeng.com/archive/2012/09/12/cocos2d-x-touch.html class Cli ...

  4. Java EE各种documentation

    总之通用的法则,google:"XxxName documentation" 例如,如果要查看JSTL的reference manual,google:jstl doc即可,ora ...

  5. JAVA-JSP之taglib指令

    相关资料:<21天学通Java Web开发>http://blog.csdn.net/dyyaries/article/details/9960987 备注:这个实例我没有跑起来,我看的是 ...

  6. platform_driver_probe 函数解析

    结构体列举 // 几个结构体 // include/linux/device.h struct bus_type { const char *name; // "platform" ...

  7. linux中的ll（转）

    linux中的ll(转) 操作系统:ubuntu 9.04 ll并不是linux下一个基本的命令,它实际上是ls -l的一个别名. Ubuntu默认不支持命令ll,必须用 ls -l,这样使用起来不是 ...

  8. Ext 的一些常用方法

    一.Ext 1.1 Ext.isEmpty(v, allowBlank) //是否为空[链接] 1.2 Ext.isArray(v) //是否为数组集合 1.3 Ext.isPrimitive(v) ...

  9. 360浏览器兼容模式 不能$.post (不是a 连接 onclick的问题!!)

    最近发现一个360浏览器很蛋疼的事情,在兼容模式下 代码: <a href="#" onclick='doAudit(1)'>审核</a> 点击没有任何效果 ...

  10. shell两个数字的运算,一共三个变量

    #!/bin/bash #两个数运算的简单脚本 + ,一共三个参数 echo $# #对获取的参数以此判断是否包含[a-zA-Z]的东西,如果包含就退出.因为数字相加不是数字就是加减乘除 for i_ ...