Jak usunąć „hover” w jQuery?

Jak usunąć „hover” w jQuery?

To nie działa:

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

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

lub bardziej zwięźle (dzięki @Chad Grant ):

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

W rzeczywistości dokumentacja jQuery ma prostsze podejście niż połączone przykłady pokazane powyżej (chociaż będą działać dobrze):

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

Począwszy od jQuery 1.7, możesz również używać $.on()i $.off()do wiązania zdarzeń, więc aby rozwiązać zdarzenie najechania, możesz użyć prostszego i bardziej przejrzystego:

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

Nazwa pseudo-zdarzenia „hover” jest używana jako skrót od „mouseenter mouseleave”, ale była obsługiwana inaczej we wcześniejszych wersjach jQuery; wymagające wyraźnego usunięcia każdej z literalnych nazw zdarzeń. Użycie $.off()teraz umożliwia porzucenie obu zdarzeń myszy przy użyciu tego samego skrótu.

Edycja 2016:

Wciąż popularne pytanie, więc warto zwrócić uwagę na uwagę @ Dennis98 w komentarzach poniżej, że w jQuery 1.9+ zdarzenie „hover” zostało wycofane na rzecz standardowych wywołań „mouseenter mouseleave”. Twoja wiążąca deklaracja wydarzenia powinna teraz wyglądać następująco:

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

Usuń powiązania zdarzeń mouseenteri mouseleaveindywidualnie lub odłącz wszystkie zdarzenia na elemencie (elementach).

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

lub

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

unbind () nie działa z zakodowanymi na stałe zdarzeniami wbudowanymi.

Na przykład, jeśli chcesz odłączyć zdarzenie mouseover od <div id="some_div" onmouseover="do_something();">, stwierdziłem, że $('#some_div').attr('onmouseover','')jest to szybki i brudny sposób na osiągnięcie tego.

Innym rozwiązaniem jest .die () dla zdarzeń, które zostały dołączone za pomocą .live () .

Dawny.:

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

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

Dobre odniesienie można znaleźć tutaj: Exploring jQuery .live () i .die ()

(Przepraszam za mój angielski: ">)

Wszystko, co robi najechanie za kulisami, wiąże się z właściwościami mouseover i mouseout. Chciałbym wiązać i usuwać twoje funkcje z tych zdarzeń indywidualnie.

Na przykład załóżmy, że masz następujący html:

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

wtedy twój jQuery wyglądałby tak:

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

});

Możesz usunąć określoną procedurę obsługi zdarzeń, która została dołączona przy onużyciuoff

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

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

Używając tego, usuniesz tylko handlerFunction
Inną dobrą praktyką jest ustawienie nameSpace dla wielu dołączonych zdarzeń

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

Zauważyłem, że to działa jako drugi argument (funkcja) do .hover ()

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

Pierwsza funkcja (argument funkcji .hover ()) to mouseover i wykona Twój kod. Drugim argumentem jest mouseout, która spowoduje odłączenie zdarzenia hover od #yourId. Twój kod zostanie wykonany tylko raz.