Як від’єднати "наведення" в jQuery?

Як від’єднати "наведення" в jQuery?

Це не працює:

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

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

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

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

Насправді, до документації на jQuery є більш простий підхід, ніж наведені вище приклади (хоча вони працюватимуть чудово):

$("#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');

Від’єднайте події mouseenterта mouseleaveподії окремо або відв’яжіть усі події на елементах.

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

або

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

unbind () не працює з жорстко кодованими вбудованими подіями.

Так, наприклад, якщо ви хочете від’єднати подію миші <div id="some_div" onmouseover="do_something();">, я виявив, що $('#some_div').attr('onmouseover','')це швидкий і брудний спосіб досягти цього.

Іншим рішенням є .die () для подій, які пов’язані з .live () .

Наприклад:

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

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

Ви можете знайти хороші відгуки тут: Дослідження jQuery .live () та .die ()

(Вибачте за мою англійську: ">)

Усі наведення курсів за кадром є прив'язкою до властивості миші та миші. Я б пов'язував і скасовував ваші функції від тих подій окремо.

Наприклад, скажіть, що у вас є такий 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);
  });

});

Ви можете видалити певний обробник подій, який було додано on, використовуючиoff

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

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

Використовуючи це, ви видалите лише обробникFunction
Ще однією хорошою практикою є встановлення простору імен для кількох доданих подій

$("#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");

Я виявив, що це працює як другий аргумент (функція) для .hover ()

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

Перша функція (аргумент .hover ()) - це перемикання миші та виконає ваш код. Другий аргумент - миші, що від’єднає подію наведення курсора від #yourId. Ваш код буде виконаний лише один раз.