Удалить прослушиватель событий, не работающий с Javascript

#javascript

#javascript

Вопрос:

Я пытаюсь удалить прослушиватель событий с помощью Javascript, но, похоже, он не работает.

Мне нужно передать объект event в обработчике, поэтому я использую .bind() .

Мой код :

 if (sidebar) {
  listItems.forEach(function(listItem) {
    listItem.showSubmenu = showSubmenu;
    listItem.addEventListener('click', listItem.showSubmenu.bind(this, subLists), true);
  });

  if (sidebarButton) {
    sidebarButton.addEventListener('click', onClickOnButton.bind(this, sidebar));
  }
}

if (sidebar.getAttribute('data-reduce') === 'true') {
  listItems.forEach(function(listItem) {
    listItem.removeEventListener('click', listItem.showSubmenu, true);
  });
}

function showSubmenu(subLists, e) {
  var target = e.currentTarget,
      subList = target.querySelector('.sidebar__sublist');

  if (subList) {

    if (subList.style.display !== 'block') {

      [...subLists].forEach(hideSubList);

      $(subList).slideDown('slow', function() {
        subList.style.display = 'block';
        target.querySelector('.sidebar__list__item__link__arrow').textContent = 'keyboard_arrow_up';
      });

    } else {
      $(subList).slideUp('slow', function() {
        subList.style.display = 'none';
        target.querySelector('.sidebar__list__item__link__arrow').textContent = 'keyboard_arrow_down';
      });
    }
  }
}
 

Результат: событие не удаляется.

Комментарии:

1. listItem.showSubmenu это не то же listItem.showSubmenu.bind(this, subLists) самое, что . Когда вы bind создаете новый объект для обработки.

2. Необходимость удаления прослушивателя событий — это запах кода в моей книге

3. @GACy20 Да, но мне нужно передать объект event , так есть ли какое-либо другое решение?

4. @tonymx227 у вас уже есть jQuery. почему бы не использовать .on() и .off() ?

5. Я нахожусь в процессе удаления моей библиотеки jQuery, в ближайшие несколько месяцев я хочу использовать собственный javascript.

Ответ №1:

как сказал @GACy20, ListItem.showSubmenu — это не то же самое, что ListItem.showSubmenu.bind(это, подсписки)

попробуйте сделать это так

 listItem.showSubmenu = showSubmenu.bind(this, subLists);
listItem.addEventListener('click', listItem.showSubmenu, true);