Как отключить "зависание" в jQuery?

Как отключить "зависание" в jQuery?

Это не работает:

$(this).unbind('hover');

Ответ 1

$(this).unbind('mouseenter').unbind('mouseleave')

или более лаконично (спасибо @Chad Grant):

$(this).unbind('mouseenter mouseleave')

Ответ 2

Собственно, jQuery documentation имеет более простой подход, чем приведенные выше примеры (хотя они будут работать очень хорошо):

$("#myElement").unbind('mouseenter mouseleave');

Как и в jQuery 1.7, вы также можете использовать $.on() и $.off() для привязки события, поэтому, чтобы отменить событие зависания, вы должны использовать более простой и более аккуратный:

$('#myElement').off('hover');

Псевдо-событие-имя "hover" используется как сокращенное обозначение для "mouseenter mouseleave", но в предыдущих версиях jQuery было обработано по-разному; требуя, чтобы вы явно удалили каждое из буквенных имен событий. Использование $.off() теперь позволяет вам удалять оба события мыши с использованием той же стенографии.

Изменить 2016:

Еще один популярный вопрос, поэтому стоит обратить внимание на @Dennis98 в комментариях ниже, что в jQuery 1.9+ событие "hover" было устарел в пользу стандартных вызовов "mouseenter mouseleave". Итак, ваше объявление привязки событий должно выглядеть следующим образом:

$('#myElement').off('mouseenter mouseleave');

Ответ 3

Отключить события mouseenter и mouseleave индивидуально или отменить все события на элементе (-ах).

$(this).unbind('mouseenter').unbind('mouseleave');

или

$(this).unbind();  // assuming you have no other handlers you want to keep

Ответ 4

unbind() не работает с жестко закодированными встроенными событиями.

Итак, например, если вы хотите отменить событие mouseover из <div id="some_div" onmouseover="do_something();">, я обнаружил, что $('#some_div').attr('onmouseover','') - быстрый и грязный способ его достижения.

Ответ 5

Другим решением является .die() для событий, которые связаны с .live().

Пример:.

// attach click event for <a> tags
$('a').live('click', function(){});

// deattach click event from <a> tags
$('a').die('click');

Здесь вы можете найти хорошую референтность: Изучение jQuery.live() и .die()

(Извините за мой английский:" > )

Ответ 6

Все зависания, выполняемые за кулисами, являются обязательными для свойства mouseover и mouseout. Я бы привязал и отвязал ваши функции от этих событий индивидуально.

Например, скажем, у вас есть следующий html:

<a href="#" class="myLink">Link</a>

то ваш jQuery будет:

$(document).ready(function() {

  function mouseOver()
  {
    $(this).css('color', 'red');
  }
  function mouseOut()
  {
    $(this).css('color', 'blue');
  }

  // either of these might work
  $('.myLink').hover(mouseOver, mouseOut); 
  $('.myLink').mouseover(mouseOver).mouseout(mouseOut); 
  // otherwise use this
  $('.myLink').bind('mouseover', mouseOver).bind('mouseout', mouseOut);


  // then to unbind
  $('.myLink').click(function(e) {
    e.preventDefault();
    $('.myLink').unbind('mouseover', mouseOver).unbind('mouseout', mouseOut);
  });

});

Ответ 7

Я нашел, что это работает как второй аргумент (функция) в .hover()

$('#yourId').hover(
    function(){
        // Your code goes here
    },
    function(){
        $(this).unbind()
    }
});

Первая функция (аргумент для .hover()) - это mouseover и будет выполнять ваш код. Второй аргумент - mouseout, который отменит событие hover от #yourId. Ваш код будет выполнен только один раз.

Ответ 8

Вы можете удалить специальный обработчик событий, который был прикреплен on, используя off

$("#ID").on ("eventName", additionalCss, handlerFunction);

// to remove the specific handler
$("#ID").off ("eventName", additionalCss, handlerFunction);

Используя это, вы удалите только handlerFunction
Другая хорошая практика - установить имяSpace для нескольких присоединенных событий

$("#ID").on ("eventName1.nameSpace", additionalCss, handlerFunction1);
$("#ID").on ("eventName2.nameSpace", additionalCss, handlerFunction2);
// ...
$("#ID").on ("eventNameN.nameSpace", additionalCss, handlerFunctionN);

// and to remove handlerFunction from 1 to N, just use this
$("#ID").off(".nameSpace");