stopImmediatePropagation()函数用于阻止剩余的事件处理函数的执行,并防止当前事件在DOM树上冒泡

根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈元素上,如果这些祖辈元素上也绑定了相应的事件处理函数,就会触发执行这些函数。

使用stopImmediatePropagation()函数可以阻止当前事件向祖辈元素的冒泡传递,也就是说该事件不会触发执行当前元素的任何祖辈元素的任何事件处理函数。

此外,与event.stopPropagation()函数相比,stopImmediatePropagation()函数还会阻止该元素剩余的其他事件处理函数的执行。

此外,由于live()函数并不是将事件处理函数直接绑定到自己身上,而是"委托"绑定到祖辈元素上,由祖辈元素来触发执行。live()函数会先一次性冒泡到文档的顶部,然后为符合条件的元素触发事件。因此,stopImmediatePropagation()函数无法阻止live事件的冒泡。

同样地,delegate()函数也是"委托事件函数",只有事件冒泡传递到"受委托"的祖辈元素才会被触发执行。因此,stopImmediatePropagation()函数无法阻止该元素到"受委托"的祖辈元素之间的事件冒泡。

该函数属于jQuery的Event对象

语法

jQuery 1.3 新增该函数。

eventObject.stopImmediatePropagation( )

返回值

stopImmediatePropagation()函数没有返回值,也可以说返回值为undefined

示例&说明

请参考下面这段HTML代码:

<p>段落文本内容
    <input type="button" value="点击" />
</p>

event.stopImmediatePropagation()函数相关的jQuery示例代码如下:

// 为所有p元素绑定click事件
$("p").click( function(event){
    alert("p-click");
} ); // 为所有button元素的click事件绑定第一个事件处理函数
$(":button").click( function(event){
    alert("button-click-1");
   
    // 阻止事件冒泡到DOM树上,并阻止剩余的事件处理函数的执行
    // 只执行button-click-1,如果注释掉该行,将执行button-click-1、button-click-2和p-click
    // 如果换成event.stopPropagation() 将执行button-click-1和button-click-2
    event.stopImmediatePropagation();
} ); // 为所有button元素的click事件绑定第二个事件处理函数
$(":button").click( function(event){
    alert("button-click-2");
} );

该函数无法阻止live()函数的事件传递,也无法阻止delegate()函数的选择元素到"受委托"元素之间的事件传递。相关示例请参考event.stopPropagation()函数文档中最后部分的示例代码。

来自:http://www.365mini.com/page/jquery-event-stopimmediatepropagation.htm

jQuery Event.stopImmediatePropagation() 函数详解的更多相关文章

  1. jQuery Event.stopPropagation() 函数详解

    stopPropagation()函数用于阻止当前事件在DOM树上冒泡. 根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈元素上,如果这些祖辈元素上也绑定了相应的事件处理函 ...

  2. jQuery Event.which 属性详解

    jQuery Event.which 属性详解 which属性用于返回触发当前事件时按下的键盘按键或鼠标按钮. 对于键盘和鼠标事件,该属性用于确定你按下的是哪一个键盘按键或鼠标按钮. which属性对 ...

  3. Jquery之each函数详解

    最近项目被each函数坑惨了,想来还是好好整理下关于each函数的方方面面,一来方便自己查阅,二来为读者提供经验和教训,废话不多说,来看看Each函数到底是怎么坑人的. 一. 全局jQuery.eac ...

  4. jQuery.fn.extend() 函数详解

    jQuery.fn.extend()函数用于为jQuery扩展一个或多个实例属性和方法(主要用于扩展方法). jQuery.fn是jQuery的原型对象,其extend()方法用于为jQuery的原型 ...

  5. JQuery中on()函数详解

    JQuery API中定义的on方法,专业名词很多,读起来并不是那么容易,而对于开发人员知道函数怎么使用就可以了.本文将JQuery的说明翻译如下: on(events,[selector],[dat ...

  6. jquery ajax error函数详解

    代码:$(document).ready(function() {            jQuery("#clearCac").click(function() {        ...

  7. jQuery Event.delegateTarget 属性详解

    // 为id为element的元素中的所有span元素绑定click事件 $("#element").on( "click", "span" ...

  8. jQuery.attr() 函数详解

    一,jQuery.attr()  函数详解: http://www.365mini.com/page/jquery-attr.htm 二,jQuery函数attr()和prop()的区别: http: ...

  9. jQuery.ready() 函数详解

    jQuery.ready() 函数详解 ready()函数用于在当前文档结构载入完毕后立即执行指定的函数. 该函数的作用相当于window.onload事件. 你可以多次调用该函数,从而绑定多个函数, ...

随机推荐

  1. MarkDown语法实操

    一级标题 这是引用 二级标题 https://daringfireball.net/projects/markdown/dingus 你好啊,这是斜体 引用 添加图片 图片alt就是显示在图片下面的文 ...

  2. flask总结02

    一:flask的响应: flask默认支持2种响应方式: 数据响应: 默认响应html文本,也可以返回 JSON格式 页面响应: 重定向 url_for 响应的时候,flask也支持自定义http响应 ...

  3. 【算法笔记】B1047 编程团体赛

    1047 编程团体赛 (20 分) 编程团体赛的规则为:每个参赛队由若干队员组成:所有队员独立比赛:参赛队的成绩为所有队员的成绩和:成绩最高的队获胜. 现给定所有队员的比赛成绩,请你编写程序找出冠军队 ...

  4. F. Clear the String(区间 DP )//每次都删除一个相同字符的子串 , 最小多少次

    https://codeforces.com/contest/1132/problem/F 借鉴:https://www.cnblogs.com/chhokmah/p/10508762.html 题意 ...

  5. 采用MQTT协议实现android消息推送(4)选fusesource-mqtt-client为客户端

    1.简介 一个java写的mqtt客户端.项目地址: https://github.com/fusesource/mqtt-client 2.引入fusesource-mqtt-client库 Fil ...

  6. 获取window.location.href路径参数

    GetQueryString(param) { //param为要获取的参数名 注:获取不到是为null var currentUrl = window.location.href; //获取当前链接 ...

  7. spark第二篇:Application Submission Guide

    提交应用 Spark的bin目录中的spark-submit脚本用于启动集群上的应用程序.它可以通过一个统一的接口使用所有Spark支持的集群管理器. 绑定应用程序的依赖 如果你的代码依赖其他项目,你 ...

  8. SSH Intro - Remove entry

    ssh-keygen -f "/home/frank/.ssh/known_hosts" -R ec2-54-222-218-195.cn-north-1.compute.amaz ...

  9. Html练习 | 小影志首页练习

    <!DOCTYPE html> <head> <title>小影志首页练习</title> <style> /*应用全页字体*/ .pg-f ...

  10. ClouderManger搭建大数据集群时ERROR 2003 (HY000): Can't connect to MySQL server on 'ubuntucmbigdata1' (111)的问题解决(图文详解)

    问题详情 相关问题的场景,是在我下面的这篇博客里 Cloudera Manager安装之利用parcels方式(在线或离线)安装3或4节点集群(包含最新稳定版本或指定版本的安装)(添加服务)(Ubun ...