How do I add removeEventListener to the javascript?

JavaScript
1

Code: https://jsfiddle.net/p1dnsotr/

  function addExitHandlers(callback) {
    const resetVideo = document.querySelectorAll(".exit");
    resetVideo.forEach(function resetVideoHandler(video) {
      video.addEventListener("click", callback);
    });
  }

I was told this:

manageUI.addExitHandlers(managePlayer.removePlayerHandler); is another function not exitClickHandler function you used when you first added the listeners to remove that listener callback function has to be the same (same ref) of the one you used to add the listener

To do that, what would be changed in the code?

2

Instead of dropping us into a conversation, we have no context for, why don’t you continue the conversation with whoever it is that is helping you?

You are asking a generic question on how to use removeEventListener but what you really want is for someone to read your code and tell you how to do it.

However, you have provided almost no information about anything. What are you trying to do because I really have no idea based on what you have posted?

I see one removeEventListener in your code and that is for something completely different.

Also, just an FYI helping you with this project is getting a little old.

3

you use the removeEventListener method on the same element you added event listener and provide the name of the handler function/callback you want to remove. Here is a simplified example:

element.addEventListener('click', myHandler)
//...
element.removeEventListener('click', myHandler)

Here i add the myHandler callback to an element and when i have to, remove it

1 Like
4

Like this? https://jsfiddle.net/ksw6bLpr/

function addExitHandlers(callback) {
        const resetVideo = document.querySelectorAll(".exit");
        resetVideo.forEach(function resetVideoHandler(video) {
        video.removeEventListener("click", callback);
        video.addEventListener("click", callback);     
        });
    }
5

you seem to use the right pattern as the element, event type and the event callback all match for the add and remove methods, altho i dont know the context of your function, what its supposed to do. It seems a bit odd to me, you first remove the handler, then add it, since before you remove, you should add it and there is no point removing it, if you then add it again right away. If your function is meant to add the event handlers, remove the line which removes them. If the function is meant to remove the handlers, the line which adds them is counter-productive, but as you already managed, the element you call the respective method, the event type and the event handler(callback) should match, in order to add/remove the same thing

6

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.