topPropagation()函数用于阻止当前事件在DOM树上冒泡。

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

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

该函数只阻止事件向祖辈元素的传播，不会阻止该元素自身绑定的其他事件处理函数的函数。event.stopImmediatePropagation()不仅会阻止事件向祖辈元素的传播，还会阻止该元素绑定的其他(尚未执行的)事件处理函数的执行。

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

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

该函数属于jQuery的Event对象。

语法

eventObject.stopPropagation( )

返回值

stopPropagation()函数没有返回值，也可以说返回值为undefined。

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

stopPropagation()阻止事件向父容器传递的更多相关文章

  1. stopPropagation()阻止事件的冒泡传递

    <!doctype html><html><head><meta charset="utf-8"><title>无标题文 ...

  2. vue子组件使用自定义事件向父组件传递数据

    使用v-on绑定自定义事件可以让子组件向父组件传递数据,用到了this.$emit(‘自定义的事件名称’,传递给父组件的数据) <!DOCTYPE html> <html lang= ...

  3. uni-app阻止事件向父级冒泡

    在官网找到的就只有这个方法,但是我放在app项目里并不支持,所以就想到vue的阻止事件冒泡的方法,现在分享,免得大家踩坑     <view class="parent" @ ...

  4. JQuery阻止事件冒泡

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

  5. JQuery阻止事件冒泡---阻止后续代码执行

    (1)什么是事件起泡 首先你要明白一点,当一个事件发生的时候,该事件总是有一个事件源,即引发这个事件的对象,一个事件不能凭空产生,这就是事件的发生. 当事件发生后,这个事件就要开始传播.为什么要传播呢 ...

  6. jQuery阻止事件冒泡的例子

    下面给给各位朋友稍加整理了一jquery中阻止事件冒泡的一些例子,我们知道JQuery 提供了两种方式来阻止事件冒泡,但我们简单的利用它来做一些应用可能不深入或不理解,下面整理了更详细的方法,有兴趣的 ...

  7. 微信小程序开发 [03] 事件、数据绑定和传递

    1.事件绑定 在微信小程序中,事件的绑定依附于组件,当事件触发时,就会执行事件对应的处理函数. 我们回到前几章中的例子,将index页面调整为首页(app.json中调整pages数组元素的顺序),此 ...

  8. JavaScript事件冒泡机制和阻止事件冒泡及默认事件

    一.阻止事件冒泡: 1.html中加return false 2.js中加return false 3.IE下:window.event.cancelBubble = true:  FF下:event ...

  9. 阻止事件冒泡js jquery

    jQuery之防止冒泡事件 冒泡事件就是点击子节点,会向上触发父节点.祖先节点的点击事件. 以下是html代码部分: <body> <div id="content&quo ...

随机推荐

  1. Android 程序调试技巧汇总

    1.Android Studio 引入一个项目作为library https://www.cnblogs.com/lixiangyang521/p/7453322.html 2.Android Stu ...

  2. PHP 备份还原 MySql 数据库

    原生 PHP 备份还原 MySql 数据库 支持 MySql,PDO 两种方式备份还原 php5.5 以上的版本建议开启pdo扩展,使用 pdo 备份还原数据 备份文件夹 db_backup.impo ...

  3. 【算法笔记】B1035 插入与归并

    1035 插入与归并 (25 分) 根据维基百科的定义: 插入排序是迭代算法,逐一获得输入数据,逐步产生有序的输出序列.每步迭代中,算法从输入序列中取出一元素,将之插入有序序列中正确的位置.如此迭代直 ...

  4. C++ STL之Vector

    向量 vector 是一种对象实体, 能够容纳许多其他类型相同的元素, 因此又被称为容器. vector 属于STL(Standard Template Library, 标准模板库)中的一种自定义的 ...

  5. ThinkPHP5.0的助手函数汇总

    load_trait:快速导入Traits,PHP5.5以上无需调用 /** * 快速导入Traits PHP5.5以上无需调用 * @param string $class trait库 * @pa ...

  6. poi读取excel2010

    package com.icss.test; import java.io.FileInputStream;import java.io.InputStream;import java.util.Ar ...

  7. rsync 参数配置说明[转]

    rsync 特性 可以镜像保存整个目录树和文件系统. 可以很容易做到保持原来文件的权限.时间.软硬链接等等. 无须特殊权限即可安装. 快速:第一次同步时 rsync 会复制全部内容,但在下一次只传输修 ...

  8. Angular4+NodeJs+MySQL 入门-01

    有一定的后台开发经验ES6语法.后台没有用框架来,纯自己写.会sql语句 安装NodeJS的安装 从网上下载 https://nodejs.org/en/ 选择自己,我用的是最新版本 Angular ...

  9. 动态替换animator的研究

    http://blog.csdn.net/tonnychu/article/details/49903657 http://blog.csdn.net/tlrainty/article/details ...

  10. File upload error - unable to create a temporary file

    php上传图片的时候会报错: File upload error - unable to create a temporary file 文件上传错误 - 无法创建一个临时文件 你只需要打开你的php ...