Skip to main content
Known Participant
August 5, 2021
Answered

Having issue with accumulative event listeners for frame navigation.

  • August 5, 2021
  • 1 reply
  • 487 views

Hey guys! I'm new and I'm having issues with my frame navigation.

My issue is that after a few times going back and forth using the navigation buttons I have created the behavior of the buttons start to become slow. The more I do it the longer it takes.

I read here that event listeners are accumulative and that I should remove the event listeners. I have tried this but when I remove the event listeners my buttons stop working.


This is the original code accumulating the events listeners.

this.btn_back.addEventListener("click", fl_ClickToGoToAndStopAtFrame);
 
function fl_ClickToGoToAndStopAtFrame()
{
root.gotoAndStop(0);
}
 
this.btn_next.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2);
 
function fl_ClickToGoToAndStopAtFrame_2()
{
root.gotoAndStop(2);
}


My question is, where should I put the removeEventListeners? I have to use these buttons all over the project and it is not necessarally sequential navigation.

I really appreciate your help guys.
This topic has been closed for replies.
Correct answer kglad



 

var _this = this;

this.btn_back.addEventListener("click", fl_ClickToGoToAndStopAtFrame);
 
function fl_ClickToGoToAndStopAtFrame()
{
_this.btn_back.removeEventListener("click", fl_ClickToGoToAndStopAtFrame);
root.gotoAndStop(0);
}
 
this.btn_next.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2);
 
function fl_ClickToGoToAndStopAtFrame_2()
{
_this.btn_next.removeEventListener("click", fl_ClickToGoToAndStopAtFrame_2);
root.gotoAndStop(2);
}


My question is, where should I put the removeEventListeners? I have to use these buttons all over the project and it is not necessarally sequential navigation.

I really appreciate your help guys.

By @renanmd

 

1 reply

kglad
Community Expert
kgladCommunity ExpertCorrect answer
Community Expert
August 5, 2021



 

var _this = this;

this.btn_back.addEventListener("click", fl_ClickToGoToAndStopAtFrame);
 
function fl_ClickToGoToAndStopAtFrame()
{
_this.btn_back.removeEventListener("click", fl_ClickToGoToAndStopAtFrame);
root.gotoAndStop(0);
}
 
this.btn_next.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2);
 
function fl_ClickToGoToAndStopAtFrame_2()
{
_this.btn_next.removeEventListener("click", fl_ClickToGoToAndStopAtFrame_2);
root.gotoAndStop(2);
}


My question is, where should I put the removeEventListeners? I have to use these buttons all over the project and it is not necessarally sequential navigation.

I really appreciate your help guys.

By @renanmd

 

renanmdAuthor
Known Participant
August 5, 2021

I tried applying this but now the buttons don't work anymore. None of them.

var _this = this;
_this.stop();
_this.btn_next.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2);
 
function fl_ClickToGoToAndStopAtFrame_2()
{
_this.removeEventListener("click", fl_ClickToGoToAndStopAtFrame);
_this.gotoAndStop(1);
}
Legend
August 5, 2021

Why did you replace "root" with "_this"?

 

And why are you removing fl_ClickToGoToAndStopAtFrame inside the fl_ClickToGoToAndStopAtFrame_2 event handler?