stopImmediatePropagation和stopPropagation (事件、防止侦听)
参考:
ActionScript 3.0 Step By Step系列(六):学对象事件模型,从点击按扭开始
一、事件模型
egret中的事件模型和flash是一样的,但是年代太久了,都忘了。
之前貌似是看殿堂之路还是哪本书,记不清了。

二、测试
下面测试一下,当有3个层级的对象监听事件时,事件触发的顺序。
创建3个方块,分别为out、mid、inner。 层级关系为out最外层,mid中间层,inner最里层。
class HomeScene extends eui.Component{
private out:eui.Rect;
private mid:eui.Rect;
private inner:eui.Rect;
public constructor() {
super();
this.skinName = "HomeSceneSkin";
}
protected childrenCreated(){
this.out = new eui.Rect(300,300,0xff0000);
this.out.touchChildren = true;
this.addChild(this.out);
this.mid = new eui.Rect(200,200,0x00ff00);
this.mid.touchChildren = true;
this.out.addChild(this.mid);
this.inner = new eui.Rect(100,100, 0x0000ff);
this.inner.touchChildren = true;
this.mid.addChild(this.inner);
this.out.addEventListener(egret.TouchEvent.TOUCH_TAP, (e:egret.TouchEvent)=>{
console.log("out");
},this);
this.mid.addEventListener(egret.TouchEvent.TOUCH_TAP, (e:egret.TouchEvent)=>{
console.log("mid");
},this);
this.inner.addEventListener(egret.TouchEvent.TOUCH_TAP, (e:egret.TouchEvent)=>{
console.log("inner");
},this);
this.inner.addEventListener(egret.TouchEvent.TOUCH_TAP, (e:egret.TouchEvent)=>{
console.log("inner2");
},this);
}
}

点击inner,输出

点击mid,输出

点击out,输出

总结:
从测试结果来看
捕获阶段:点击inner时,进入捕获阶段,从out->mid->inner
目标阶段:当找到inner时,第一个输出"inner"
冒泡阶段:在冒泡阶段时,会从inner->mid->out顺序冒泡,所以依次输出的是"mid"、"out"
所以测试结果还是符合事件模型的。
三、stopImmediatePropagation
防止对事件流中当前节点中和所有后续节点中的事件侦听器进行处理
在inner中增加stopImmediatePropagation
this.inner.addEventListener(egret.TouchEvent.TOUCH_TAP, (e:egret.TouchEvent)=>{
console.log("inner");
e.stopImmediatePropagation();
},this);
点击inner,输出

可见防止了当前节点inner2和后继节点mid、out的节点事件侦听
四、stopPropagation
防止对事件流中当前节点的后续节点中的所有事件侦听器进行处理
this.inner.addEventListener(egret.TouchEvent.TOUCH_TAP, (e:egret.TouchEvent)=>{
console.log("inner");
e.stopPropagation();
},this);
点击inner,输出

可见防止了后继节点mid和out的事件侦听
五、target和currentTarget
this.out.addEventListener(egret.TouchEvent.TOUCH_TAP, (e:egret.TouchEvent)=>{
console.log("out");
console.log(e.target.width); //100
console.log(e.currentTarget.width); //300
},this);
点击inner,输出

可见目标阶段对象e.target是inner,最终冒泡的对象e.currentTarget是out
stopImmediatePropagation和stopPropagation (事件、防止侦听)的更多相关文章
- 浏览器标签tab窗口切换时事件状态侦听
做到 是大屏项目,用的websocket,在浏览器切换标签窗口后,过了一段时间回来,页面会非常卡,所以想页面切回来的时候刷新页面,找到了这个方法,这是原来的例子.这段代码可以自己复制去做下测试 var ...
- Laravel 事件侦听的几个方法 [Trait, Model boot(), Observer Class]
1 Trait 1.1 可以在 Trait 中定义一个静态的 bootFooBar() 方法,注:FooBar 是你的 Trait 名称 namespace App\Traits; use App\A ...
- JavaScript DOM高级程序设计 4.3控制事件流和注册事件侦听器--我要坚持到底!
一.事件流 我们通过下面一个实例,进行说明. <body> <h1>Event Flow</h1> <ul id="nav"> &l ...
- javascript中事件总结&通用的事件侦听器函数封装&事件委托
前言: JAVASCRIPT与HTML之间的交互是通过事件来实现的.事件,就是文档或浏览器窗口中发生的一些特定交互瞬间.可以使用侦听器( 或处理程序 )来预定事件,以便事件发生时执行相应的代码.这种在 ...
- Unity3D 自定义事件(事件侦听与事件触发)
先来看下效果图,图中点击 Cube(EventDispatcher),Sphere(EventListener)以及 Capsule(EventListener)会做出相应的变化,例子中的对象相互之间 ...
- js事件流、事件处理程序/事件侦听器
1.事件流 事件冒泡 IE的事件流叫做事件冒泡(event bubbling),即事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播到较为不具体的节点(文档). 事件捕获 ...
- Android事件侦听器回调方法浅谈
http://developer.51cto.com/art/201001/180846.htm Android事件侦听器作为视图View类的接口,其中包含有不少回调方法,比如:onClick():o ...
- 异常将上下文初始化事件发送到类的侦听器实例.[org.springframework.web.context.ContextLoaderListener] org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'sessionFactory' defined in class p
严重: 异常将上下文初始化事件发送到类的侦听器实例.[org.springframework.web.context.ContextLoaderListener]org.springframework ...
- vue02 过滤器、计算和侦听属性、vue对象的生命周期、阻止事件冒泡和刷新页面
3. Vue对象提供的属性功能 3.1 过滤器 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 3.1.1 使用Vue.fil ...
随机推荐
- Linux中Subversion配置实例
一.安装 yum install subversion 二.配置 本系统采用为每个项目单独建一版本库的策略.配置文件,密码文件,访问控制文件等都放在版本库的conf目录下. 所以每次开始一个新项目都必 ...
- 如果BarTender出现卸载不干净的问题如何处理
自从BarTender 2016出了之后,好多小伙伴都想试试新功能咋样,这就意味着首先要卸载电脑上旧版BarTender.然而就是这个操作,难倒了好一批人,他们表示BarTender卸载卸不干净,不仅 ...
- Python下字符画(ascii art)生成
之前在b站上看到有人用C写了个脚本把妹抖龙op转换成字符画的形式输出了,感觉比较好玩在下就用python也写了一遍(主要是因为python比较简单好用).这里就这里就不介绍字符画了,因为能搜到这个的肯 ...
- Centos修改时间显示的时区,将UTC修改为CST
问题说明: 今天一同事反应,系统的时间不对和正常的时间差8个小时.就登录主机看了下时间 系统时间显示为: # date Fri Dec :: UTC # 备注:查看了下,正好和当前的时间差了8个小时. ...
- docker 相关文章
https://baijiahao.baidu.com/s?id=1581420975184566963&wfr=spider&for=pc 创建centos基础镜像 https ...
- pycharm使用docker容器的python解释器,
上一篇是pycharm调用docker的镜像的python解释器. 此篇介绍pycharm 调用docker的容器的python解释器. 这两个思路还是不一样的,第一个是用pycham界面的选择pyt ...
- 在Ubuntu中开启Soft AP功能
在Ubuntu中开启Soft AP功能 1.查看采用的无线网卡是否支持Soft AP: 注意,可以看到有AP字样,表明支持.楼主比较背,在易迅上挑了个销量最高的netcore nw360,结果无法搭建 ...
- SpringMVC -- 梗概--源码--壹--springMVC json处理
附:实体类 Class : User package com.c61.entity; import java.text.SimpleDateFormat; import java.util.Date; ...
- VMWARE workstation 9 收缩虚拟硬盘
在9以前的版本中可以通过在客户机中vmtools收缩硬盘,而在9以后这个功能没有了.虚拟机中使用过的虚拟硬盘即使删除了所有数据,使用vmware workstation 9 的clean up dis ...
- ios开发之--首页 导航栏隐藏 下一级页面显示,pop回来显示白条
解决方法,在首页中实现如下两个方法,代码如下: -(void)viewWillDisappear:(BOOL)animated { [super viewWillDisappear:animated] ...