Copy link to clipboard
Copied
Hi,
I can’t seem to get on and off working in respect of addEventListener and removeEventListener.
Here is my simple code as example:
var me = this;
this.btn1.on("click", btn1Click);
this.btn1.on("mouseover", btn1Over);
this.btn1.on("mouseout", btn1Out);
function btn1Click(){
removeEvents();
//code does other stuff
}
function btn1Over(){
// code for over state
}
function btn1Out(){
//code to resume button to normal state
}
function removeEvents(){
me.btn1.off("mouseout", btn1Out);
}
The off does not work in the removeEvents() function. But when I try the code…
var me = this;
this.btn1.addEventListener("click", btn1Click);
this.btn1.addEventListener("mouseover", btn1Over);
this.btn1.addEventListener("mouseout", btn1Out);
function btn1Click(){
removeEvents();
//code does other stuff
}
function btn1Over(){
// code for over state
}
function btn1Out(){
//code to resume button to normal state
}
function removeEvents(){
me.btn1.removeEventListener("mouseout", btn1Out);
}
This works! I’d like to know how I am using on and off in place of addEventListener and removeEventListener incorrectly?
I have looked and tried to understand the instructions on the CreateJS site but as I am not a strong programmer it is going over my head.
Cheers!
Hi Gory
in order to use on and off to add and remove eventHandlers, so to speak, you have to wrap the on Handler into a variable like this
var btn1ClickWrapper = this.btn1.on("click", btn1Click);
then you can remove the handler using the wrapper like this:
this.btn1.off("click", btn1ClickWrapper);
See also here: EaselJS v1.0.0 API Documentation : MovieClip
Klaus
Copy link to clipboard
Copied
I wonder if just using mouseEnabled = false or mouseEnabled = true; would not be simpler.
Copy link to clipboard
Copied
Hi res,
that's what I usually use that works but just wondered if there was something I was doing wrong with the on and off events? I thought they acted like addEventListener and removeEventListener respectively? Just wanted to understand them better.
Cheers!
Copy link to clipboard
Copied
As far as I know, .off() is jquery so you would need to have jquery loaded for it to work.
Copy link to clipboard
Copied
Hi Gory
in order to use on and off to add and remove eventHandlers, so to speak, you have to wrap the on Handler into a variable like this
var btn1ClickWrapper = this.btn1.on("click", btn1Click);
then you can remove the handler using the wrapper like this:
this.btn1.off("click", btn1ClickWrapper);
See also here: EaselJS v1.0.0 API Documentation : MovieClip
Klaus
Copy link to clipboard
Copied
Thanks Klaus.
Your simple and clear breakdown really helped, as I had looked at that documentation at some point before but it just wasn't clicking with me.
Cheers
Greg