Skip to main content
Known Participant
August 5, 2021
Answered

Having issue with accumulative event listeners for frame navigation.

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 is closed to new replies. Start a new post to keep the conversation going.
kglad
kgladCorrect 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

 

5 replies

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

 

Translate
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);
}
Translate
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?

 

Translate