按照官方的事件流图解

 

实例讲解：

初始化：

设舞台、父节点、Child1节点、Child2节点都是显示对象。

然后做如下操作:

舞台.addChild(父节点);父节点.addChild(Child1节点);父节点.addChild(Child2节点);父节点.addEventListener(MouseEvent.MOUSE_DOWN, function, false);Child1节点.addEventListener(MouseEvent.MOUSE_DOWN, function);

父节点和Child1节点分别添加了鼠标事件侦听器。

 

演示:

如果我点击Child1节点，Child1节点便发出一个MouseEvent事件(这就是我们的主角)

dispatchEvent(new MouseEvent());

接着该MouseEvent便开始了它的“旅程”，寻找它的侦听器们。

 

先说下这个MouseEvent的旅程(三个阶段):

 

 

1.这个MouseEvent从舞台出发，经过父节点，直到快要到达目的地Child1节点(它的出生地);

                                                                        -----------这个过程就是捕获阶段;

2.然后它经过Child1节点(它的出生地);

                                                                        -----------这个过程就是目标阶段;

3.最后原路返回，经过父节点，回到舞台;

                                                                        -----------这个过程就是冒泡阶段。

上面蓝色的字就是MouseEvent途中经过的节点。

舞台→父节点→Child1节点→父节点→舞台

还可以设置减少MouseEvent的路程，只要设置bubbles:Boolean = false;

MouseEvent就只走捕获阶段和目标阶段，而不走冒泡阶段了。

　需要注意的是(MouseEvent和KeyboardEvent的bubbles默认为true，而Event的bubbles默认是false);

 

 

下面说下这个MouseEvent的任务(寻找它的侦听器们):

 

我们已经分别在父节点和Child1节点上添加了MouseEvent的侦听器(利用addEventListener)

　　但是这些侦听器都有些怪脾气，父节点上的侦听器只在目标阶段和冒泡阶段才接收MouseEvent事件，

　　捕获阶段就是经过了也不理睬。

　　究其缘由是因为在addEventListener的时候默认设置了useCapture:Boolean = false;

　　如果设置为true，那就只在捕获阶段接收MouseEvent，

　　那如果要让父节点在所有阶段都接收MouseEvent事件呢？

　　那就只好弄两个侦听器了，一个在捕获阶段接收，一个在目标冒泡阶段接收。

　　如下:

父节点.addEventListener(MouseEvent.MOUSE_DOWN, function, false);父节点.addEventListener(MouseEvent.MOUSE_DOWN, function, true);

 

最后要记住，事件要途经注册侦听器的节点，并且该侦听器要同意在此阶段接受该事件，侦听器函数才会执行。