Метод off - удаление функции-обработчика событий у элемента
Метод off
позволяет отвязать обработчик
событий от элемента. Чтобы привязать обработчик
можно воспользоваться методом
off
.
Синтаксис
Так мы удаляем обработчик событий у элемента,
в качестве первого параметра в виде строки
передается одно или несколько событий разделенных
пробелами, вторым - передаем допольнительный
фильтрующий селектор потомков внутри элемента
(он должен совпадать с тем, что мы передавали в
в метод on
, когда прикрепляли
обработчик). Чтобы удалить все делегированные события,
передайте значение '**'
. Второй параметр
необязательный. Третьим передаем функцию-обработчик
(которую мы прикрепляли), в которую передается объект
события или передаем false
:
$(селектор).off(события, [селектор], функция-обработчик(объект события));
Можно воспользоваться методом off
по-другому,
тогда в первый параметр передается
объект JavaScript, где ключи - тип события, а
значения - функции-обработчики, которые мы добавляли к
элементу:
$(селектор).off({'тип события': handler}, [селектор]);
Можем просто передать один параметр в виде
объекта jQuery.Event
:
$(селектор).off(событие);
Если не передавать методу параметры, то мы отвяжем от элемента все прикрепленные обработчики:
$(селектор).off();
Пример
Давайте к абзацам добавим функцию-обработчик
testFunc
. Но сразу же удалим обработчик у
второго абзаца, т.о. клик по второму абзацу не будет
ни к чему приводить (если же мы закоментируем последнюю
строчку кода, то увидим как событие срабатывает и
по клику на второй абзац):
<p id="test1">click1</p>
<p id="test2">click2</p>
function testFunc(event) {
alert(event.data.text);
}
$('#test1').on('click', {text: 'aaa'}, testFunc); // добавляем обработчик
$('#test2').on('click', {text: 'bbb'}, testFunc); // добавляем обработчик
$('#test2').off('click', testFunc); // удаляем обработчик