Как правильно удалить обработчик события в jQuery?

Вопрос

Предположим, что есть некий DIV, и я навесил на неё обработчик события клика, и теперь если кликнуть по нём, то выполняется некое действие. Но действие должно выполняться только один раз, после этого обработчик события надо убрать. Я пробовал заменить его на другой:

$('#mydiv').click(function { return false; });

Но это не работает, действие по прежнему выполняется. Как удалить обработчик события на jQuery?


Ответ №1

В твоём примере ты просто добавил ещё один обработчик события на свой DIV, но не заменил предыдущий.

$('#mydiv').click(function() { return false; });

Этот код добавляет обработчик клика, не зависимо от того, есть ли у твоего DIV-а обработчики этого события, или нет. В JavaScript одному и тому же объекту можно назначить множество разных обработчиков событий, все они сработают при возникновении этого события.

Для того, чтобы удалить обработчик в старых версиях jQuery, использовалась функция .unbind():

$('#mydiv').unbind('click');

С выходом jQuery 1.7 модель событий была переработана, и хотя методы .bind() и .unbind() по прежнему доступны для обратной совместимости, рекомендуется вместо них использовать соответствующие им методы on() и off().

$('#mydiv').click(function() { return false; }); // Добавляет ещё один обработчик события
$('#mydiv').off('click');
$('#mydiv').on('click.mynamespace', function() { /* Что-то делаем */ });
$('#mydiv').off('click.mynamespace');

Есть также функция .one(), которая позволяет повесить обработчик события, который сработает только один раз, а затем удалится.

$("mydiv").one("click", function() {
    // Что-то делаем
});

1 комментарий

Добавить комментарий


(обязательно)