.off()

.off( events [, selector ] [, handler ] )Возвращает: jQuery

Описание: Удалить обработчик события.

версия добавлена: 1.7.off( events [, selector ] [, handler ] )
- events
  
  Тип: Строка
  
  Одна или несколько разделённых пробелами типов событий и необязательных пространств имён, или только пространства имён, например "click", "keydown.myPlugin", или ".myPlugin".
- selector
  
  Тип: Строка
  
  Селектор, который должен соответствовать тому, который был первоначально передан в .on() при подключении обработчиков событий.
- handler
  
  Тип: Функция( Событие eventObject )
  
  Функция обработчика, ранее подключённая для события(ов), или специальное значение false.
версия добавлена: 1.7.off( events [, selector ] )
- events
  
  Тип: Объект
  
  Объект, где строковые ключи представляют один или несколько разделённых пробелами типов событий и необязательных пространств имён, а значения представляют функции обработчиков, ранее подключённые для события(ов).
- selector
  
  Тип: Строка
  
  Селектор, который должен соответствовать тому, который был первоначально передан в .on() при подключении обработчиков событий.
версия добавлена: 1.7.off( event )
- event
  
  Тип: Событие
  
  Объект jQuery.Event.
версия добавлена: 1.7.off()
- Эта сигнатура не принимает никаких аргументов.

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

Если предоставлено простое имя события, например "click", все события этого типа (как прямые, так и делегированные) удаляются из элементов в наборе jQuery. При написании кода, который будет использоваться как плагин, или просто при работе с большим кодовым основанием, лучшей практикой является подключение и отключение событий с использованием пространств имён, чтобы код не удалял обработчики событий, подключённые другим кодом. Все события всех типов в определённом пространстве имён можно удалить из элемента, просто указав пространство имён, например ".myPlugin". Минимально, должно быть предоставлено либо пространство имён, либо имя события.

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

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

Как и в .on(), вы можете передать events как объект вместо указания строки events и функции handler как отдельных аргументов. Ключи для объекта events - это события и/или пространства имён; значения - это функции обработчиков или специальное значение false.

Примеры:

Добавить и удалить обработчики событий на цветной кнопке.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>off demo</title>
  <style>
  button {
    margin: 5px;
  }
  button#theone {
    color: red;
    background: yellow;
  }
  </style>
  <script src="https://code.jquery.com/jquery-3.7.0.js"></script>
</head>
<body>
 
<button id="theone">Does nothing...</button>
<button id="bind">Add Click</button>
<button id="unbind">Remove Click</button>
<div style="display:none;">Click!</div>
 
<script>
function flash() {
  $( "div" ).show().fadeOut( "slow" );
}
$( "#bind" ).on( "click", function() {
  $( "body" )
    .on( "click", "#theone", flash )
    .find( "#theone" )
      .text( "Can Click!" );
});
$( "#unbind" ).on( "click", function() {
  $( "body" )
    .off( "click", "#theone", flash )
    .find( "#theone" )
      .text( "Does nothing..." );
});
</script>
 
</body>
</html>

Демо:

Удалить все обработчики событий из всех абзацев:

$( "p" ).off();

Удалить все делегированные обработчики кликов из всех абзацев:

$( "p" ).off( "click", "**" );

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

var foo = function() {
  // Code to handle some kind of event
};
 
// ... Now foo will be called when paragraphs are clicked ...
$( "body" ).on( "click", "p", foo );
 
// ... Foo will no longer be called.
$( "body" ).off( "click", "p", foo );

Отменить все делегированные обработчики событий по их пространству имён:

var validate = function() {
  // Code to validate form entries
};
 
// Delegate events under the ".validator" namespace
$( "form" ).on( "click.validator", "button", validate );
 
$( "form" ).on( "keypress.validator", "input[type='text']", validate );
 
// Remove event handlers in the ".validator" namespace
$( "form" ).off( ".validator" );

.off( events [, selector ] [, handler ] )Возвращает: jQuery

версия добавлена: 1.7.off( events [, selector ] [, handler ] )

версия добавлена: 1.7.off( events [, selector ] )

версия добавлена: 1.7.off( event )

версия добавлена: 1.7.off()

Примеры:

Демо: