変な振る舞いをしています。TextFlow 内に HTML リンクがあります。を設定するlinkHoverFormat
と、ロールオーバー/ロールアウト イベントがチェーンに送信され始めます。これらのイベントはバブルしないと言いますが、どういうわけかバブルします。そして、私は彼らがそうするのを止めることができないようです.
次に例を示します。
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Declarations>
<s:TextLayoutFormat id="linkNormal" textDecoration="none" color="0x556677"/>
<s:TextLayoutFormat id="linkHover" textDecoration="underline" color="0x0000FF"/>
<s:TextFlow id="textFlow1"
linkActiveFormat="{linkHover}"
linkHoverFormat="{linkHover}"
linkNormalFormat="{linkNormal}">
<s:p> <s:a href="http://projects.nunogodinho.com">hover</s:a> </s:p>
</s:TextFlow>
</fx:Declarations>
<fx:Script>
<![CDATA[
// This pair of handlers is triggered by the panel
protected function rollOverHandler(e:MouseEvent):void {
panel.title = "over";
}
protected function rollOutHandler(e:MouseEvent):void {
panel.title = "out";
}
]]>
</fx:Script>
<s:Panel left="10" top="10" id="panel" mouseOver="rollOverHandler(event)" mouseOut="rollOutHandler(event)">
<s:RichEditableText id="ret1"
top="10"
editable="false"
textFlow="{textFlow1}" />
</s:Panel>
</s:WindowedApplication>
このアプリを実行し、パネルから移動せずにマウスをリンクの上に数回移動すると、テキストが変更されていることがわかります。
そこで私は、この奇妙な出来事がバブリングするのを止めようと決心しました。
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Declarations>
<s:TextLayoutFormat id="linkNormal" textDecoration="none" color="0x556677"/>
<s:TextLayoutFormat id="linkHover" textDecoration="underline" color="0x0000FF"/>
<s:TextFlow id="textFlow2"
linkActiveFormat="{linkHover}"
linkHoverFormat="{linkHover}"
linkNormalFormat="{linkNormal}">
<s:p> <s:a rollOver="linkelement2_rollOverHandler(event)" rollOut="linkelement2_rollOutHandler(event)" href="http://projects.nunogodinho.com">hover</s:a> </s:p>
</s:TextFlow>
</fx:Declarations>
<fx:Script>
<![CDATA[
import flashx.textLayout.events.FlowElementMouseEvent;
// This pair of handlers is triggered by the panel
protected function rollOverHandler(e:MouseEvent):void {
panel.title = "over";
}
protected function rollOutHandler(e:MouseEvent):void {
panel.title = "out";
}
// This pair of handlers is triggered by the <A> element inside textFlow2
// and I hoped it would stop the event from bubbling up to the panel
protected function linkelement2_rollOverHandler(e:FlowElementMouseEvent):void {
e.preventDefault();
e.stopImmediatePropagation();
e.stopPropagation()
}
protected function linkelement2_rollOutHandler(e:FlowElementMouseEvent):void {
e.preventDefault();
e.stopImmediatePropagation();
e.stopPropagation()
}
// I also tried to intercept the event in the RichEditableText but got the same weird
// behavior: the event triggers the panel's rollOver/rollOut intermittently
]]>
</fx:Script>
<s:Panel left="10" top="10" id="panel" mouseOver="rollOverHandler(event)" mouseOut="rollOutHandler(event)">
<s:RichEditableText top="10" left="55"
editable="false"
textFlow="{textFlow2}" />
</s:Panel>
</s:WindowedApplication>
とのすべての組み合わせpreventDefault
を試しました。イベントの動作は変更されますが、リンクのホバリング効果も損なわれます。stopImmediatePropagation
stopPropagation
次に、でイベントをインターセプトしようとしましたRichEditableText
が、同じような結果が得られました。
かつて同様の問題がありましたが、rollOver/rollOut の代わりに mouseOver/mouseOut イベントを使用していたことが原因であることがわかりました。rollOver/rollOut に切り替えたので、うまくいきました。今まで。
そして今、私は無知です。
助けてください。
ありがとう。