Как удалить прослушиватель событий в JavaScript?

Мне интересно, как я могу удалить прослушиватель событий после добавления одного, как вы используете on и off в jquery?

document.removeEventListener('touchstart');
document.addEventListener('touchstart', function (e) {
     closePopupOnClick(e, popup);
});

но это фактически не удаляет прослушиватель событий. Если я помещу код addEventListener в функцию и передам эту функцию в removeEventListener, он не будет работать bc, вы не можете передать параметры в функцию. Кто-нибудь знает, как это сделать?

1 ответов


поместите слушателя в качестве переменной и прикрепите через .addEventListener

var myListener = function (e) {
    closePopupOnClick(e, popup);
};
document.addEventListener('touchstart', myListener, true);

затем передайте его снова при удалении с .removeEventListener

document.removeEventListener('touchstart', myListener);

если вы не в строгом режиме вы можете заставить слушателя удалить себя с помощью arguments.callee

document.addEventListener('touchstart', function (e) {
    closePopupOnClick(e, popup);
    document.removeEventListener('touchstart', arguments.callee);
}, true);

если вы не в строгом режиме, вы должны использовать выражения с именованными фунциями если вы хотите удалить функцию сам

document.addEventListener('touchstart', function myListener(e) {
    closePopupOnClick(e, popup);
    document.removeEventListener('touchstart', myListener);
}, true);

если вы хотите использовать переменные в слушателя, которые могут быть изменены (например, петли), то вы можете написать функцию генератора, например

function listenerGenerator(popup) {
    return function (e) {
        closePopupOnClick(e, popup);
    };
}

теперь вы можете создать слушателя с listenerGenerator(popup) и он будет охватывать popup переменной. Обратите внимание, что if popup это объект, будет как byref и, следовательно, все еще могут быть подвержены изменениям.