CODEWITHSUNDEEP
javascriptremoveeventlistener
Pharmann Pharmanson
Pharmann Pharmanson

Reputation: 13

Remove eventlistener

Help:-) How do i remove this listener?

this.overlay.addEventListener('click', this._handlePlay.bind(this));

_handlePlay looks like this:

_handlePlay() {
    this._isOpen = !this._isOpen;
  }

i tried...

this.overlay.removeEventListener('click', this._handlePlay.bind(this));

and more desperately:

this.overlay.removeEventListener('click', this._handlePlay());

but the listener wont leave the scene?

I have the bind as I am in js and web component context

/regards

Upvotes: 1

Views: 50

Answers (1)

Quentin
Quentin

Reputation: 943097

The function you pass to removeEventListener needs to be the same function that you pass to addEventListener.

bind creates a new function.

this.overlay.addEventListener('click', this._handlePlay.bind(this));

Since you don't keep the value of this._handlePlay.bind(this), there's no way to get that function back to pass it to removeEventListener.

You need to keep the value somewhere that you can access when you later try to remove the event listener.

const boundHandlePlay = this._handlePlay.bind(this);
this.overlay.addEventListener('click', boundHandlePlay);
this.overlay.removeEventListener('click', boundHandlePlay);

Upvotes: 3

Related Questions