flex_停止事件傳播說明示例;
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
minWidth="1024" minHeight="768" pageTitle="TheStudioOfCenyebao"
applicationComplete="initFn()">
<!-- Demo_如何停止事件傳播
猜想:事件流_事件觸發順序
首先被觸發的是按鈕裏邊添加的監聽器(在MXML中添加),接着是通過addEventListener()添加的監聽器,
接着事件就冒泡到按鈕父組件HGroup,觸發父組件裏邊的監聽器。
不過使用event.stopPropagation()或者event.stopImmediatePropagation()都會阻止事件從按鈕冒泡
到其父組件,兩者的區別就是stopPropagation()函數會在給定組件(按鈕)上的所有其他事件監聽器完成對這個
事件(比如MouseEvent)的響應之後停止傳播,而stopImmediatePropagation則是直接停止此事件傳播。
-->
<fx:Script>
<![CDATA[
import mx.controls.Alert;
protected function initFn():void{
// 添加事件監聽器;
button.addEventListener(MouseEvent.CLICK, onClick);
box.addEventListener(MouseEvent.CLICK, onParentClick);
}
protected function button_clickHandler(event:MouseEvent):void
{
Alert.show("MXML click event.", "MXML Event");
trace("第一個被觸發 Event");
//event.stopPropagation(); // 事件停止傳播--但是第二個監聽器會觸發;
event.stopImmediatePropagation(); // 停止傳播--後面所有監聽器都不會觸發;
}
protected function onClick(event:Event):void{
Alert.show("AS event.Calling stopPropagation", "AS Event");
trace("第二個被觸發 Event");
}
protected function onParentClick(event:Event):void{
// 事件永遠不會傳播(冒泡)到父組件,不管使用event.stopPropagation()或者event.stopImmediatePropagation()。
Alert.show("You should never see this alert.", "Parent Event");
trace("第三個被觸發 Event");
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 非可視元素 -->
</fx:Declarations>
<!--view-->
<s:HGroup id="box" horizontalCenter="0" verticalCenter="0">
<s:Button id="button" label="FireEvent" click="button_clickHandler(event)"/>
</s:HGroup>
</s:Application>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.