参考:

ActionScript 3.0 Step By Step系列(六):学对象事件模型,从点击按扭开始

actionscript宝典

一、事件模型

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 (事件、防止侦听)的更多相关文章

  1. 浏览器标签tab窗口切换时事件状态侦听

    做到 是大屏项目,用的websocket,在浏览器切换标签窗口后,过了一段时间回来,页面会非常卡,所以想页面切回来的时候刷新页面,找到了这个方法,这是原来的例子.这段代码可以自己复制去做下测试 var ...

  2. Laravel 事件侦听的几个方法 [Trait, Model boot(), Observer Class]

    1 Trait 1.1 可以在 Trait 中定义一个静态的 bootFooBar() 方法,注:FooBar 是你的 Trait 名称 namespace App\Traits; use App\A ...

  3. JavaScript DOM高级程序设计 4.3控制事件流和注册事件侦听器--我要坚持到底!

    一.事件流 我们通过下面一个实例,进行说明. <body> <h1>Event Flow</h1> <ul id="nav"> &l ...

  4. javascript中事件总结&通用的事件侦听器函数封装&事件委托

    前言: JAVASCRIPT与HTML之间的交互是通过事件来实现的.事件,就是文档或浏览器窗口中发生的一些特定交互瞬间.可以使用侦听器( 或处理程序 )来预定事件,以便事件发生时执行相应的代码.这种在 ...

  5. Unity3D 自定义事件(事件侦听与事件触发)

    先来看下效果图,图中点击 Cube(EventDispatcher),Sphere(EventListener)以及 Capsule(EventListener)会做出相应的变化,例子中的对象相互之间 ...

  6. js事件流、事件处理程序/事件侦听器

    1.事件流 事件冒泡 IE的事件流叫做事件冒泡(event bubbling),即事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播到较为不具体的节点(文档). 事件捕获 ...

  7. Android事件侦听器回调方法浅谈

    http://developer.51cto.com/art/201001/180846.htm Android事件侦听器作为视图View类的接口,其中包含有不少回调方法,比如:onClick():o ...

  8. 异常将上下文初始化事件发送到类的侦听器实例.[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 ...

  9. vue02 过滤器、计算和侦听属性、vue对象的生命周期、阻止事件冒泡和刷新页面

    3. Vue对象提供的属性功能 3.1 过滤器 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 3.1.1 使用Vue.fil ...

随机推荐

  1. Thinkphp5 Route用法

    域名路由:domain 1.application/router.php 文件位置,吧一下代码放进去就可以了 use think\Route; Route::domain('app.tp5a.com' ...

  2. asp.net MVC中防止跨站请求攻击(CSRF)的ajax用法

    参考: Preventing Cross-Site Request Forgery (CSRF) AttacksValidating .NET MVC 4 anti forgery tokens in ...

  3. git绑定两个远程仓库

    最近在做公司项目,之前公司项目统一托管在codding 码云,最近我想把项目与自己的gitlab私人仓库再连接一下,作为自己作品收录的地方,这里总结一下用到的git命令及问题. 1.首先, 找到当前已 ...

  4. sql产生随机时间

    --建立过程 CREATE PROCEDURE GetTime     @BeginTime VARCHAR(5),     @EndTime VARCHAR(5),     @RandTime VA ...

  5. LINUX下安装软件方法命令方法

    1.通常Linux应用软件的安装包有三种: 1) tar包,如software-1.2.3-1.tar.gz.它是使用UNIX系统的打包工具tar打包的. 2) rpm包,如software-1.2. ...

  6. 如何使用Maven scope

    maven 有6个scope类型,下面简单总结备忘下 <dependency> <groupId>javax.servlet</groupId> <artif ...

  7. linux定时任务cron配置[转]

    实现linux定时任务有:cron.anacron.at等,这里主要介绍cron服务. 名词解释: cron是服务名称,crond是后台进程,crontab则是定制好的计划任务表. 软件包安装: 要使 ...

  8. linux 停止对某个端口的监听

    1.通过"netstat -anp" 来查看哪些端口被打开. 2.关掉对应的应用程序,则端口就自然关闭了,如:"kill -9 PID" (PID:进程号)

  9. Splash evaljs() 方法

    evaljs() 方法可以执行 JavaScript 代码并返回最后一条 JavaScript 语句的返回结果 function main(splash, args) splash:go(" ...

  10. ARM入门最好的文章

    一 首先说说arm的发展  可以用一片大好来形容,翻开各个公司的网站,招聘里面嵌入式占据了大半工程师职位.广义的嵌入式无非几种:传统的什么51.avr.pic称做嵌入式微控制器:arm是嵌入式微处理器 ...