Удаление анонимного прослушивателя событий

Ответ 1

Невозможно очистить обработчик события, если вы не сохранили ссылку на обработчик события при создании.

Обычно я добавляю их к основному объекту на этой странице, после чего вы можете выполнять итерацию и очищать их, когда это делается с этим объектом.

Ответ 2

Вы можете удалить прослушиватель событий следующим образом:

element.addEventListener("click", function clicked() {
    element.removeEventListener("click", clicked, false);
}, false);

Ответ 3

Анонимные слушатели связанных событий

Самый простой способ удалить все прослушиватели событий для элемента - назначить его outerHTML самому себе. Что это делает, это отправляет строковое представление HTML через анализатор HTML и назначает проанализированный HTML элементу. Поскольку JavaScript не передается, не будет прослушивателей связанных событий.

document.getElementById('demo').addEventListener('click', function(){
    alert('Clickrd');
    this.outerHTML = this.outerHTML;
}, false);

<a id="demo" href="javascript:void(0)">Click Me</a>

Ответ 4

Вы можете попробовать перезаписать element.addEventListener и сделать все, что хотите.
Что-то вроде:

var orig = element.addEventListener;

element.addEventListener = function (type, listener) {
    if (/dontwant/.test(listener.toSource())) { // listener has something i dont want
        // do nothing
    } else {
        orig.apply(this, Array.prototype.slice.apply(arguments));
    }
};

ps: не рекомендуется, но он будет делать трюк (не проверял его)

Ответ 5

Редактировать: Как Manngo предложил для комментария, вы должны использовать .off() вместо .unbind(), так как .unbind() устарел с jQuery 3.0 и заменен с jQuery 1.7.

Несмотря на то, что это старый вопрос, и в нем не упоминается jQuery, я опубликую свой ответ здесь, так как это первый результат для поискового запроса 'jquery remove anonymous event handler'.

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

$('#button1').click(function() {
       alert('This is a test');
});

$('#btnRemoveListener').click(function() {
       $('#button1').off('click');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="button1">Click me</button>
<hr/>
<button id="btnRemoveListener">Remove listener</button>

Ответ 6

Назначение обработчиков событий с литеральными функциями сложнее - не только нет способа их удалить, не клонируя node и не заменяя его клоном - вы также можете ненадлежащим образом назначить один и тот же обработчик несколько раз, что не может если вы используете ссылку на обработчик. Две функции всегда рассматриваются как два разных объекта, даже если они идентичны.

Ответ 7

Вы можете попытаться удалить всех слушателей таким образом:

allClicks = getEventListeners(element).click
allClicks.forEach(function(el){el.remove()})

или вы можете удалить (например) только последнее добавленное событие

allClicks = getEventListeners(element).click
allClicks[allClicks.length-1].remove()

Ответ 8

Старый вопрос, но здесь есть решение.

Строго говоря, вы не можете удалить анонимный прослушиватель событий, если не сохраните ссылку на функцию. Поскольку цель использования анонимной функции, по-видимому, не в том, чтобы создать новую переменную, вы можете вместо этого сохранить ссылку в самом элементе:

element.addEventListener('click',element.fn=function fn() {
    //  Event Code
}, false);

Позже, когда вы захотите удалить его, вы можете сделать следующее:

element.removeEventListener('click',element.fn, false);

Помните, что третий параметр (false) должен иметь то же значение, что и для добавления прослушивателя событий.

Однако сам вопрос напрашивается другой: почему?

Есть две причины использовать .addEventListener() а не простой .onsomething():

Во-первых, он позволяет добавлять несколько прослушивателей событий. Это становится проблемой, когда дело доходит до их выборочного удаления: вы, вероятно, в конечном итоге назовете их. Если вы хотите удалить их все, тогда решение @tidy-giants outerHTML отлично.

Во-вторых, у вас есть возможность выбрать захват, а не всплывающее событие.

Если ни одна из причин не важна, вы можете решить использовать более onsomething метод чего-либо.

Ответ 9

Следующее работало достаточно хорошо для меня. Код обрабатывает случай, когда другое событие вызывает удаление слушателя из элемента. Нет необходимости в объявлениях функций заранее.

myElem.addEventListener("click", myFunc = function() { /*do stuff*/ });

/*things happen*/

myElem.removeEventListener("click", myFunc);

Ответ 10

Если вы используете метод jQuery try off

$("element").off("event");

Ответ 11

Метод JQuery.off() удаляет обработчики событий, которые были связаны с .on()