Как уничтожить слушателя события «Popstate»? - PullRequest
0 голосов
/ 08 апреля 2019

Пробовал код ниже, но он не уничтожает Popstate Event.

Пожалуйста, помогите нам с примером, в котором я могу уничтожить Popstate Event в зависимости от условия.

history.pushState(null, document.title, location.href);
window.addEventListener('popstate', function (event) {
  if (true){
    history.pushState(null, document.title, location.href);
    console.log('Back Button Prevented');
  } else {
      window.removeEventListener('popstate', ()=> {
          console.log('Go back');
      }, true);
      history.back();
  }
});

Ответы [ 2 ]

2 голосов
/ 08 апреля 2019

Чтобы удалить слушателя, вы должны передать саму функцию слушателя removeEventListener().

Другая проблема в вашем коде состоит в том, что при использовании if (true) вы никогда не достигнетеelse блок, который удаляет слушателя.То, что вы, вероятно, захотите сделать, это иметь булеву переменную вне слушателя, которую вы изменяете при первом вызове слушателя.

var backButtonPrevented = false;
history.pushState(null, document.title, location.href);

function popStateListener(event) {
  if (backButtonPrevented === false){
    history.pushState(null, document.title, location.href);
    console.log('Back Button Prevented');
    backButtonPrevented = true;
  } else {
      window.removeEventListener('popstate', popStateListener);
      history.back();
  }
}

window.addEventListener('popstate', popStateListener);
0 голосов
/ 08 апреля 2019

Второй аргумент, который вы передаете removeEventListener, должен быть функцией, которую вы хотите удалить .

Вы передаете другую функцию, которая не была зарегистрирована как обработчик событий, поэтому ничего не происходит.

Объявите ваш обработчик событий как функцию со ссылкойВы можете использовать повторно.Затем используйте эту ссылку для и removeEventListener и addEventListener.

history.pushState(null, document.title, location.href);

function myEventListener (event) { 
  if (true){
    history.pushState(null, document.title, location.href);
    console.log('Back Button Prevented');
  } else {

      window.removeEventListener('popstate', myEventListener);
      history.back();
  }
}

window.addEventListener('popstate', myEventListener);
...