FLEX/FLASH-冒泡事件与非冒泡事件

1.

项目 右键 新建 包

右键单击新建的包,新建 actionscript类

代码如下(代码1)

package btnEvents

{

import flash.events.Event;

public class btnEvent1 extends Event

{

public static var EVENT_NAME:String="customEvent";

//该事件所携带的数据

public var EventData:String;

public function btnEvent1(type:String, bubbles:Boolean=false, cancelable:Boolean=false)

{

super(type, bubbles, cancelable);

}

}

}

2.

主MXML文件如下所示

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:Modules="Modules.*"

creationComplete="init()"

>

import btnEvents.btnEvent1;

private function init():void{

this.addEventListener(btnEvent1.EVENT_NAME,appCatchMyEvent,true);

this.panel1.addEventListener(btnEvent1.EVENT_NAME,panelCatchEvent,true);

}

private function sendEvent(flag:int):void{

var Event:btnEvent1=new btnEvent1(btnEvent1.EVENT_NAME);

if(flag == 1){

Event.EventData = "内部按钮";

btn1.dispatchEvent(Event);//将事件分派到事件流中

}else{

Event.EventData = "外部按钮";

btn2.dispatchEvent(Event);//将事件分派到事件流中

}

}

private function appCatchMyEvent(par_event:btnEvent1):void{

label1.text += par_event.currentTarget.id+par_event.EventData;//currentTarget是传播路径上的当前捕捉者

}

private function panelCatchEvent(par_event:btnEvent1):void{

label1.text += par_event.currentTarget.id+par_event.EventData;

}

]]>

3.

运行程序

点击“内部BTN:

结果如图所示

大家可以看到

事件是从外层容器到内层容器依次执行的

4.

刷新页面

点击“外部BTN”

结果如图所示

因为事件的引发者没有在panl1中所以不会再触发panel1的事件了

以上说的都是非冒泡事件,事件的执行顺序是从外层容器到内层容器执行的

5.

如果要在事件冒泡阶段捕捉事件

创建事件的代码为

var Event:btnEvent1=new btnEvent1(btnEvent1.EVENT_NAME,true);//最后一个参数bubbles应为true

事件监听的代码应如下

this.panel1.addEventListener(btnEvent1.EVENT_NAME,panelCatchEvent,false);//最后一个参数useCapture是false

这样设置后就是冒泡事件,事件的执行顺序是从内层容器到外层容器执行的

6.

如果即要捕捉非冒泡事件,又要捕捉冒泡事件

那么

创建事件的代码为

var Event:btnEvent1=new btnEvent1(btnEvent1.EVENT_NAME,true);//最后一个参数bubbles应为true

同时,监听事件的代码还要设置两次

this.panel1.addEventListener(btnEvent1.EVENT_NAME,panelCatchEvent,true);//非冒泡监听

this.panel1.addEventListener(btnEvent1.EVENT_NAME,panelCatchEvent,false);//冒泡监听

这样设置之后,事件先从外部执行到内部,在从内部执行到外部