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. 【贪心】洛谷 P1199 三国游戏 题解

     这个题尽管题目长,主要还是证明贪心的正确性(与博弈关系不大) 题目描述 小涵很喜欢电脑游戏,这些天他正在玩一个叫做<三国>的游戏. 在游戏中,小涵和计算机各执一方,组建各自的军队进行对战 ...

  2. HDU - 6188

    用vis表贪心异常方便 #include<bits/stdc++.h> #define rep(i,j,k) for(register int i=j;i<=k;i++) #defi ...

  3. Apache Shiro(四)-登录认证和权限管理WEB支持(Servlet)

    新建web项目 web.xml 修改web.xml,在里面加了个过滤器. 这个过滤器的作用,简单的说,就是 Shiro 入门里的TestShiro 这部分的工作,悄悄的干了. //加载配置文件,并获取 ...

  4. [转] Kubernetes K8S 简介

    [From] https://blog.csdn.net/zhangxxxww/article/details/73547251 Kubernetes(k8s)是自动化容器操作的开源平台,这些操作包括 ...

  5. [转] electron实战开发详细流程

    [From] http://www.myk3.com/arc-8856.html 很久没有更新博客,人越来越懒了,唉 说好做的electron教程距离上次玩electron已经过去了好几个月了.. 这 ...

  6. bugzilla配置邮箱发送邮件问题

    2018-09-25 1.bugzilla注册账号,邮件无法发送 需要登录管理账号,配置邮箱服务 2.Can't locate object method "quit" via p ...

  7. Android IntentFilter 匹配原则浅析

    1 Intent分为两大类,显式和隐式. 显式事件,就是指通过 component Name 属性,明确指定了目标组件的事件. 比如我们新建一个Intent,指名道姓的说,此事件用于启动名为" ...

  8. cloudemanager安装时出现ProtocolError: <ProtocolError for 127.0.0.1/RPC2: 401 Unauthorized>问题解决方法(图文详解)

    不多说,直接上干货! 问题详情 查看日志/var/log/cloudera-scm-agent/,得知 解决办法 $> ps -ef | grep supervisord $> kill ...

  9. 【程序员技术练级】学习一门脚本语言 python(一)文件处理

    现在工作上主要用的语言是java,java在企业级的应用上能够发挥很好的用途,但有时候要做一个小功能时,比如批量更新文件,抓取网页等,这时候用java就显得太笨重了.因此就学习了python这门脚本语 ...

  10. 关于Json字符串"反序列化Error reading JObject from JsonReader. Current JsonReader item is not an object: StartArray. Path..."

    描述的很清楚就是说给它的不是一个对象,而是一个数组,所以他在建议你用JArray去解析,但是你明明就是给它的一个对象,并不是一个数组 这是我下意识的去把我的json字符串中的"[ ]&quo ...