addEventListener using a for loop
November 12, 2008 by jared
Instead of using
btn0.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn1.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn2.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn3.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn4.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn5.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn6.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn7.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn8.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn9.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn10.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn11.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn12.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
btn13.addEventListener(MouseEvent.MOUSE_OVER, doSomething);
You could use this
for (var i:uint = 0; i < 14; i++)
this["btn"+i].addEventListener(MouseEvent.MOUSE_OVER, doSomething);
heya, very handy, I’m implementing something similar except that the method I call sends a couple of parameters as well. Having trouble though and was keen to see your source code but the link doesn’t work to
“Click here to download sample file addEventListener.fla”
Cheers
woops. fixed now. care to share your code as well.
Thanks for that.
sure.
I decided to remove the parameters though and simply give the movie clip the properties instead, which the function accesses using ‘target.propertyname’. K, so this is a bit intertwined with papervision3D (It displays 3 planes, which flip when you clip them):
//imports
var viewport:Viewport3D = new Viewport3D(0, 0, true, true, true, true);
addChild(viewport);
viewport.buttonMode = true;
var renderer:BasicRenderEngine = new BasicRenderEngine();
var scene:Scene3D = new Scene3D();
var camera:Camera3D = new Camera3D();
camera.zoom = 11;
camera.focus = 100;
//positioning of planes
var xpos:Number = 0;
var ypos:Number = 0;
var planesf1:Array = new Array(); //front side of plane
var planesf2:Array = new Array(); //backside of each plane
var bams:Array = new Array(); //font side material
var bams2:Array = new Array(); // back side material
for(var i:uint = 1;i<=3;i++)
{
bams[i] = new MovieMaterial(getChildByName(“faceb”+i));
bams[i].interactive = true;
bams[i].smooth = true;
bams2[i] = new MovieMaterial(getChildByName(“face”+i));
bams2[i].smooth = true;
bams[i].interactive = true;
this["faceb"+i].num = i; //property added to movieclip instad of sending parameters
this["face"+i].num = i;
this["faceb"+i].addEventListener(MouseEvent.CLICK, cardClick); // this listener works fine
this["face"+i].addEventListener(MouseEvent.CLICK, cardClick2); //this listener doesn’t seem to get written ??
planesf1[i] = new Plane(bams[i], 237 , 149 , xpos , ypos);
planesf1[i].y = ypos;
planesf1[i].z = 1;
planesf2[i] = new Plane(bams2[i], 237 , 149 , xpos , ypos);
planesf2[i].y = ypos;
planesf2[i].rotationX = 180;
planesf2[i].z = 0;
scene.addChild(planesf1[i]);
scene.addChild(planesf2[i]);
ypos = ypos + 159;
}
renderer.renderScene(scene , camera , viewport);
function cardClick(e:MouseEvent):void
{
var i:Number = e.target.num;
var rot:Number = planesf1[i].rotationY + 180;
Tweener.addTween(planesf1[i], { time:2, transition:’easeinoutback’, rotationY: rot } );
var rot2:Number = planesf2[i].rotationY + 180;
Tweener.addTween(planesf2[i], { time:2, transition:’easeinoutback’, rotationY: rot2 } );
}
function cardClick2(e:MouseEvent):void
{
trace(e.target.num);
var j:Number = e.target.num;
var rot3:Number = planesf1[j].rotationY + 180;
Tweener.addTween(planesf1[j], { time:2, transition:’easeinoutback’, rotationY: rot3 } );
var rot4:Number = planesf2[j].rotationY + 180;
Tweener.addTween(planesf2[j], { time:2, transition:’easeinoutback’, rotationY: rot4 } );
}
addEventListener(Event.ENTER_FRAME, loop);
function loop(e:Event):void
{
renderer.renderScene(scene, camera, viewport);
}
Oops, I spotted an error which was causing the second function to not get called.
At:
bams2[i] = new MovieMaterial(getChildByName(“face”+i));
bams2[i].smooth = true;
bams[i].interactive = true;
The last line is missing a ‘2′, it should be
bams2[i].interactive = true;
Also worth noteing, it seems there are a lot out there interested in sending parameters to functions when adding Listeners. Some have created separate classes to do this, but I came across this, which works fine:
stage.addEventListener(MouseEvent.CLICK,function(evt:MouseEvent){myfunction(evt,”hello world”)},false , 0 , false);
function myfunction(e:MouseEvent, msg:String):void
{
trace(msg);
}
traces “Hello World”
Hope that helps someone.
thanks very helpful!
this a sample code that im currently using…but i need to find a way do this long script, as simple as possible…
Code:
btn1.addEventListener(MouseEvent.CLICK, goto1)
btn2.addEventListener(MouseEvent.CLICK, goto2)
btn3.addEventListener(MouseEvent.CLICK, goto3)
btn4.addEventListener(MouseEvent.CLICK, goto4)
btn5.addEventListener(MouseEvent.CLICK, goto5)
different buttons have different functions, so how can i add the functions by looping them?
like….
for (var i:uint = 0; i < 5; i++)
this["btn"+i].addEventListener(MouseEvent.MOUSE_OVER, doSomethingDifferent)
how doSomethingDifferent can be manipulated just like the this["btn"+i], unfortunatlly i cant…it throws error(s)
thanks in advance.
you’re better off with a stage.addEventListener and in the function, do a switch statement,
switch (e.target.name)
{
case “btn1″:
// something1
return;
case “btn2″:
// something2
return;
}
if you really want to do it your way, you could store your function names as an Array and access it through there..