Метод для удаления обработчиков, установленных с помощью .on()

.off()

Удаляет с выбранных элементов страницы обработчики событий, установленные с помощью метода .on(). Имеет два варианта использования:

.off([events], [selector], [handler]):jQuery1.7

events — тип(ы) обрабатываемых событий. Например "click", "resize" и.т.д. Может быть указано сразу несколько типов, разделенных пробелами, а так же, могут быть указаны пространства имен.
selectorселектор, указанный (если он был указан) при установке события в методе .on().
handler — функция, которую необходимо удалить из обработчиков.</tt>.

.on(events-map, [selector]):jQuery1.7

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

events-map — объект, в котором нужно перечислить типы событий и соответствующие им удаляемые обработчики. Задается в формате {events-1:handler-1, events-2:handler-2, ...}, где events-i и handler-i соответствуют параметрам events и handler в первом варианте метода (описанном выше).
selector — см. выше.

off() удаляет обработчики, установленные с помощью on() и обладает связанными с ним параметрами. Поэтому, подробное описание по их использованию можно найти в статье про on().

Использования метода

Простой пример:

function handler() {
  alert('Шла Саша по шоссе');
};
$('#foo').on('click', handler);  // установим обработчик нажатия кнопки мыши на элементе foo
$('#foo').off('click', handler); // удалим обработчик

Если не указывать какой именно обработчик следует удалить, будут удалены все обработчики заданного события:

$('#foo').off('click'); // удалим все обработчики события 'click' у элемента foo
А если не указывать тип события, то у выбранных элементов будут удалены обработчики всех событий:
$('#foo').off(); // удалим все обработчики установленные на элементе foo

Если вы пишете плагин или работаете над крупным сайтом, над которым работают другие люди, желательно при установке обработчиков событий использовать пространство имен, чтобы в последствии можно было безболезненно удалять с элементов свои обработчики, не затрагивая чужих. Если указать только пространство имен: '.myPlagin', то с выбранных элементов будут удалены обработчики всех типов событий, с указанным пространством имен.

Чтобы удалить делегированные обработчики, необходимо указывать параметр selector, в точности совпадающий с таким же параметром, использованным в методе .on() при установке удаляемого теперь обработчика. Если нужно удалить с элементов все делегированные обработчики, не затрагивая обработчики, установленные непосредственно, следует в параметре selector указать специфическое значение — '**'.

При удалении конкретных обработчиков (когда задан параметр handler) следует быть осторожным, если при их установке использовалась $.proxy() или подобные механизмы. Это связанно с тем, что для удаления конкретных обработчиков, jQuery сравнивает специфические id функций, которые будут совпадать для функций, созданных с помощью $.proxy(). В связи с этим, с элементов могут быть удалены обработчики, которые вы не планировали удалять. Обезопасить себя от этой проблемы можно с помощью использования пространства имен.

Ссылки

Поисковые ключи:
  • удаление обработчика событий
  • снятие обработчика событий
  • .off()
  • off()