Problem with removing event listener (vanilla js)

Question

How to remove event listener which is a method of exisiting object? I have a code like this in main.js

loadSite = new LoadSite(
      'js/options.js',
      'pages/options.html',
       containerMain,
      'options-wrapper'
     );

  options.addEventListener(
   'click',
   function () {
     loadSite.loadSite();
   },
   false
   );

And I want to remove this listner in another module. I tried write this:

   import { LoadSite } from './classes/LoadSite.js';
(() => {
  const options = document.querySelector('.options'),
    loadSite = new LoadSite(
      'js/options.js',
      'pages/options.html',
      containerMain,
      'options-wrapper'
    );
  options.removeEventListener('click', function () {
    loadSite.loadSite;
  });
})();

But it didn't work and I don't know how to make this. Can someone help me?

Rajdeep D · Accepted Answer · 2021-06-09 08:59:43Z

2

To remove a listener you need to pass the same listener which you registered during add.

function listener() {
     loadSite.loadSite();
   }
options.addEventListener('click', listener, false);
options.removeEventListener('click', listener, false);

answered Jun 9, 2021 at 8:59

Rajdeep D

3,9201 gold badge12 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Problem with removing event listener (vanilla js)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related