event.preventDefault 即使我了解 stopImmediatePropagation 和 stopPropagation,我也不清楚
event.preventDefault is unclear for me even if I understand stopImmediatePropagation and stopPropagation
event.preventDefault对我来说似乎很难理解。(这是AS3的阴暗面)。 :)
stopImmediatePropagation - stopPropagation 方法非常容易理解。
这是我做的一个测试(时间线上只需要一个copy/paste)这样可以避免你花太多时间。
我只是不明白在什么情况下 preventDefault 可能有用...
如果您有一些建议或链接,请给我一些反馈?
这是代码:
// This example is coded on the Timeline.
// The Stage must fit 550 * 400 pixels (default size).
import flash.display.DisplayObjectContainer;
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.text.TextFormat;
import flash.text.TextFormatAlign;
// function to create a MovieClip and return it to a variable.
function createMC(target:DisplayObjectContainer):MovieClip{
var mc:MovieClip = new MovieClip();
target.addChild(mc);
return mc;
}
// function that draws a Rectangle in the MovieClip of your choice.
function dRect(target:MovieClip,x:uint,y:uint,width:uint,height:uint,color:uint,alpha:Number):void{
var g:Graphics = target.graphics;
g.lineStyle(1,0x000000);
g.beginFill(color,alpha);
g.drawRect(x-width/2,y-height/2,width,height);
g.endFill();
}
// event function that trace the properties of the Event.
function traceTarget(me:MouseEvent):void{
trace(" *** event.phase = " + me.eventPhase + ", event.bubbles = " + me.bubbles);
trace("me.target.name = " + me.target.name);
trace("me.currentTarget.name(the listening object) = " + me.currentTarget.name);
/*
Use preventDefault and the events for m1 AND this will be triggered.
MOUSE_DOWN,setText will be called 2 times 1 time for this, the second time for m1!
MOUSE_DOWN,traceTarget will be called 2 times 1 time for this, the second time for m1!
*/
//me.preventDefault();
/*
Use stopPropagation to avoid that the same function is not called if an event occurs.
MOUSE_DOWN,setText will be called !
*/
me.stopPropagation();
/*
Use stopImmediatePropagation to avoid all the functions that another listener may trigger.
MOUSE_DOWN,setText WILL NEVER BE CALLED because traceTarget has been called!
stopImmediatePropagation will only allow the first listener (traceTarget).
*/
//me.stopImmediatePropagation();
trace(me.toString());
// trace the Event that is triggered.
}
function setText(me:MouseEvent):void{
tf_1.text = "me.target.name = " + me.target.name;
tf_1.setTextFormat(tf);
countText++;
trace("setText("+ me.target + ") has been called " + countText + " time(s)");
countText = 0;
}
/*
A counter to see how many times an Event method is triggered
*/
var countText:uint = 0;
/*
Declare a TextField
*/
var tf_1:TextField = new TextField();
this.addChild(tf_1);
tf_1.width = 300;
tf_1.height = 20;
tf_1.x = this.stage.stageWidth - this.stage.stageWidth/2 - tf_1.width/2;
tf_1.y = 30;
var tf:TextFormat = new TextFormat(null,16,0xff0000,true,null,null,null,null,TextFormatAlign.CENTER)
tf_1.text = "Click on a Square/Rectangle";
tf_1.setTextFormat(tf);
/*
Declare 4 MovieClips
3 MovieClips inside each other
- m1 on "this" (root1 in this case).
- m2 inside m1
- m3 inside m2
1 MovieClip on "this" (root1 in this case).
*/
var m1:MovieClip
var m2:MovieClip
var m3:MovieClip
var otherClip:MovieClip
// Create the MovieClips
m1 = createMC(this);
m2 = createMC(m1);
m3 = createMC(m2);
otherClip = createMC(this);
// set the names for the MovieClip's
m1.name = "movieClip_1";
m2.name = "movieClip_2";
m3.name = "movieClip_3";
otherClip.name = "otherClip";
// Draw Rectangles in the MovieClip's
dRect(m1,275,200,100,100,0xff0000,1);
dRect(m2,275,200,50,50,0x00ff00,1);
dRect(m3,275,200,25,25,0x0000ff,1);
dRect(otherClip,100,200,50,50,0xff9900,1);
// Add a listener on m1 MovieClip.
m1.addEventListener(MouseEvent.MOUSE_DOWN,traceTarget,false);
m1.addEventListener(MouseEvent.MOUSE_DOWN,setText,false);
// Add a listener on root (root1 in this case).
this.addEventListener(MouseEvent.MOUSE_DOWN,traceTarget,false);
this.addEventListener(MouseEvent.MOUSE_DOWN,setText,false);
如果你能帮助我理解 preventDefault 方法,我会很高兴。
此致。尼古拉斯.
来自documentation of preventDefault()
Many events have associated behaviors that are carried out by default. For example, if a user types a character into a text field, the default behavior is that the character is displayed in the text field. Because the TextEvent.TEXT_INPUT
event's default behavior can be canceled, you can use the preventDefault()
method to prevent the character from appearing.
这是一个例子:
package
{
import flash.text.TextField;
import flash.text.TextFieldType;
import flash.display.Sprite;
import flash.events.TextEvent;
public class Main extends Sprite
{
public function Main()
{
var tf:TextField = new TextField();
tf.type = TextFieldType.INPUT;
tf.border = true;
addChild(tf);
tf.addEventListener(TextEvent.TEXT_INPUT, onInput);
}
private function onInput(te:TextEvent):void
{
te.preventDefault();
}
}
}
TextField
在那里,但您无法输入。如果注释掉添加侦听器的行,则默认行为不会阻止,您可以键入。
stopImmediatePropagation()
, stopPropagation()
and eventPhase
都是关注事件流:捕获、目标和冒泡三个阶段。因此,它们可用于影响是否 Event
"reaches" 一个为其添加了侦听器的对象。如果您想将为事件添加的侦听器视为自定义行为,则可以将上面的三个称为“preventCustom()
”。
这两种方法的文档明确提到了这一点:
Note: This method does not cancel the behavior associated with this event; see preventDefault()
for that functionality.
preventDefault()
处理与事件关联的默认行为,与事件流无关。
例如,您可能认为可以通过在 stage
处为捕获阶段添加侦听器然后停止传播来实现与上述示例相同的效果,如下所示:
package
{
import flash.text.TextField;
import flash.text.TextFieldType;
import flash.display.Sprite;
import flash.events.TextEvent;
public class Main extends Sprite
{
public function Main()
{
var tf:TextField = new TextField();
tf.type = TextFieldType.INPUT;
tf.border = true;
addChild(tf);
stage.addEventListener(TextEvent.TEXT_INPUT, onInput, true); // new: added to stage and for capturing phase
}
private function onInput(te:TextEvent):void
{
te.stopImmediatePropagation(); // new: stopping propagation
}
}
}
如果您执行此代码,您将能够很好地输入 TextField
。同样,您只是在搞乱这里的事件流,而不是默认行为。你所做的只是防止后续的监听器获得 Event
,例如,如果你向 TextField
本身添加一个监听器,如下所示,它将永远不会被执行,因为你在之前停止了事件流达到了。
package
{
import flash.text.TextField;
import flash.text.TextFieldType;
import flash.display.Sprite;
import flash.events.TextEvent;
public class Main extends Sprite
{
public function Main()
{
var tf:TextField = new TextField();
tf.type = TextFieldType.INPUT;
tf.border = true;
addChild(tf);
tf.addEventListener(TextEvent.TEXT_INPUT, onTfInput);
stage.addEventListener(TextEvent.TEXT_INPUT, onInput, true);
}
private function onTfInput(te:TextEvent):void
{
// never executed
}
private function onInput(te:TextEvent):void
{
te.stopImmediatePropagation();
}
}
}
tl,博士;
如果您发现炸弹的自拍计时器在滴答作响,stopImmediatePropagation()
会阻止其他人注意到这一点并可能避免恐慌,但只有 preventDefault()
才能挽救您的生命。如果 cancelable
是 false
,你最好 运行.
来自 as3 文档:preventDefault() "cancels the events behaviour if that behaviour can be cancelled"。
我可以举的一个例子是 android 后退按钮。如果您按下后退按钮,默认情况下它将最小化您的 AIR 应用程序。但是如果你监听它并调用 preventDefault()。它将停止该默认行为,以便您可以导航到上次打开的页面。
另一个例子是 android 上的主页按钮,您可以调用 preventDefault() 但此操作无法取消,因此将被忽略。
然而,像您的示例一样的鼠标事件,我无法测试它到底做了什么
event.preventDefault对我来说似乎很难理解。(这是AS3的阴暗面)。 :)
stopImmediatePropagation - stopPropagation 方法非常容易理解。 这是我做的一个测试(时间线上只需要一个copy/paste)这样可以避免你花太多时间。
我只是不明白在什么情况下 preventDefault 可能有用... 如果您有一些建议或链接,请给我一些反馈?
这是代码:
// This example is coded on the Timeline.
// The Stage must fit 550 * 400 pixels (default size).
import flash.display.DisplayObjectContainer;
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.text.TextFormat;
import flash.text.TextFormatAlign;
// function to create a MovieClip and return it to a variable.
function createMC(target:DisplayObjectContainer):MovieClip{
var mc:MovieClip = new MovieClip();
target.addChild(mc);
return mc;
}
// function that draws a Rectangle in the MovieClip of your choice.
function dRect(target:MovieClip,x:uint,y:uint,width:uint,height:uint,color:uint,alpha:Number):void{
var g:Graphics = target.graphics;
g.lineStyle(1,0x000000);
g.beginFill(color,alpha);
g.drawRect(x-width/2,y-height/2,width,height);
g.endFill();
}
// event function that trace the properties of the Event.
function traceTarget(me:MouseEvent):void{
trace(" *** event.phase = " + me.eventPhase + ", event.bubbles = " + me.bubbles);
trace("me.target.name = " + me.target.name);
trace("me.currentTarget.name(the listening object) = " + me.currentTarget.name);
/*
Use preventDefault and the events for m1 AND this will be triggered.
MOUSE_DOWN,setText will be called 2 times 1 time for this, the second time for m1!
MOUSE_DOWN,traceTarget will be called 2 times 1 time for this, the second time for m1!
*/
//me.preventDefault();
/*
Use stopPropagation to avoid that the same function is not called if an event occurs.
MOUSE_DOWN,setText will be called !
*/
me.stopPropagation();
/*
Use stopImmediatePropagation to avoid all the functions that another listener may trigger.
MOUSE_DOWN,setText WILL NEVER BE CALLED because traceTarget has been called!
stopImmediatePropagation will only allow the first listener (traceTarget).
*/
//me.stopImmediatePropagation();
trace(me.toString());
// trace the Event that is triggered.
}
function setText(me:MouseEvent):void{
tf_1.text = "me.target.name = " + me.target.name;
tf_1.setTextFormat(tf);
countText++;
trace("setText("+ me.target + ") has been called " + countText + " time(s)");
countText = 0;
}
/*
A counter to see how many times an Event method is triggered
*/
var countText:uint = 0;
/*
Declare a TextField
*/
var tf_1:TextField = new TextField();
this.addChild(tf_1);
tf_1.width = 300;
tf_1.height = 20;
tf_1.x = this.stage.stageWidth - this.stage.stageWidth/2 - tf_1.width/2;
tf_1.y = 30;
var tf:TextFormat = new TextFormat(null,16,0xff0000,true,null,null,null,null,TextFormatAlign.CENTER)
tf_1.text = "Click on a Square/Rectangle";
tf_1.setTextFormat(tf);
/*
Declare 4 MovieClips
3 MovieClips inside each other
- m1 on "this" (root1 in this case).
- m2 inside m1
- m3 inside m2
1 MovieClip on "this" (root1 in this case).
*/
var m1:MovieClip
var m2:MovieClip
var m3:MovieClip
var otherClip:MovieClip
// Create the MovieClips
m1 = createMC(this);
m2 = createMC(m1);
m3 = createMC(m2);
otherClip = createMC(this);
// set the names for the MovieClip's
m1.name = "movieClip_1";
m2.name = "movieClip_2";
m3.name = "movieClip_3";
otherClip.name = "otherClip";
// Draw Rectangles in the MovieClip's
dRect(m1,275,200,100,100,0xff0000,1);
dRect(m2,275,200,50,50,0x00ff00,1);
dRect(m3,275,200,25,25,0x0000ff,1);
dRect(otherClip,100,200,50,50,0xff9900,1);
// Add a listener on m1 MovieClip.
m1.addEventListener(MouseEvent.MOUSE_DOWN,traceTarget,false);
m1.addEventListener(MouseEvent.MOUSE_DOWN,setText,false);
// Add a listener on root (root1 in this case).
this.addEventListener(MouseEvent.MOUSE_DOWN,traceTarget,false);
this.addEventListener(MouseEvent.MOUSE_DOWN,setText,false);
如果你能帮助我理解 preventDefault 方法,我会很高兴。
此致。尼古拉斯.
来自documentation of preventDefault()
Many events have associated behaviors that are carried out by default. For example, if a user types a character into a text field, the default behavior is that the character is displayed in the text field. Because the
TextEvent.TEXT_INPUT
event's default behavior can be canceled, you can use thepreventDefault()
method to prevent the character from appearing.
这是一个例子:
package
{
import flash.text.TextField;
import flash.text.TextFieldType;
import flash.display.Sprite;
import flash.events.TextEvent;
public class Main extends Sprite
{
public function Main()
{
var tf:TextField = new TextField();
tf.type = TextFieldType.INPUT;
tf.border = true;
addChild(tf);
tf.addEventListener(TextEvent.TEXT_INPUT, onInput);
}
private function onInput(te:TextEvent):void
{
te.preventDefault();
}
}
}
TextField
在那里,但您无法输入。如果注释掉添加侦听器的行,则默认行为不会阻止,您可以键入。
stopImmediatePropagation()
, stopPropagation()
and eventPhase
都是关注事件流:捕获、目标和冒泡三个阶段。因此,它们可用于影响是否 Event
"reaches" 一个为其添加了侦听器的对象。如果您想将为事件添加的侦听器视为自定义行为,则可以将上面的三个称为“preventCustom()
”。
这两种方法的文档明确提到了这一点:
Note: This method does not cancel the behavior associated with this event; see
preventDefault()
for that functionality.
preventDefault()
处理与事件关联的默认行为,与事件流无关。
例如,您可能认为可以通过在 stage
处为捕获阶段添加侦听器然后停止传播来实现与上述示例相同的效果,如下所示:
package
{
import flash.text.TextField;
import flash.text.TextFieldType;
import flash.display.Sprite;
import flash.events.TextEvent;
public class Main extends Sprite
{
public function Main()
{
var tf:TextField = new TextField();
tf.type = TextFieldType.INPUT;
tf.border = true;
addChild(tf);
stage.addEventListener(TextEvent.TEXT_INPUT, onInput, true); // new: added to stage and for capturing phase
}
private function onInput(te:TextEvent):void
{
te.stopImmediatePropagation(); // new: stopping propagation
}
}
}
如果您执行此代码,您将能够很好地输入 TextField
。同样,您只是在搞乱这里的事件流,而不是默认行为。你所做的只是防止后续的监听器获得 Event
,例如,如果你向 TextField
本身添加一个监听器,如下所示,它将永远不会被执行,因为你在之前停止了事件流达到了。
package
{
import flash.text.TextField;
import flash.text.TextFieldType;
import flash.display.Sprite;
import flash.events.TextEvent;
public class Main extends Sprite
{
public function Main()
{
var tf:TextField = new TextField();
tf.type = TextFieldType.INPUT;
tf.border = true;
addChild(tf);
tf.addEventListener(TextEvent.TEXT_INPUT, onTfInput);
stage.addEventListener(TextEvent.TEXT_INPUT, onInput, true);
}
private function onTfInput(te:TextEvent):void
{
// never executed
}
private function onInput(te:TextEvent):void
{
te.stopImmediatePropagation();
}
}
}
tl,博士;
如果您发现炸弹的自拍计时器在滴答作响,stopImmediatePropagation()
会阻止其他人注意到这一点并可能避免恐慌,但只有 preventDefault()
才能挽救您的生命。如果 cancelable
是 false
,你最好 运行.
来自 as3 文档:preventDefault() "cancels the events behaviour if that behaviour can be cancelled"。
我可以举的一个例子是 android 后退按钮。如果您按下后退按钮,默认情况下它将最小化您的 AIR 应用程序。但是如果你监听它并调用 preventDefault()。它将停止该默认行为,以便您可以导航到上次打开的页面。
另一个例子是 android 上的主页按钮,您可以调用 preventDefault() 但此操作无法取消,因此将被忽略。
然而,像您的示例一样的鼠标事件,我无法测试它到底做了什么