Bagaimana cara melepaskan "hover" di jQuery?

Bagaimana cara melepaskan "hover" di jQuery?

Ini tidak bekerja:

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

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

atau lebih ringkas (terima kasih @Chad Grant ):

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

Sebenarnya, dokumentasi jQuery memiliki pendekatan yang lebih sederhana daripada contoh berantai yang ditunjukkan di atas (meskipun mereka akan bekerja dengan baik):

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

Mulai jQuery 1.7, Anda juga dapat menggunakan $.on()dan $.off()untuk event binding, jadi untuk melepas event hover, Anda akan menggunakan yang lebih sederhana dan lebih rapi:

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

Pseudo-event-name "hover" digunakan sebagai singkatan dari "mouseenter mouseleave" tetapi ditangani secara berbeda di versi jQuery sebelumnya; mengharuskan Anda untuk secara tegas menghapus setiap nama acara literal. Menggunakan $.off()sekarang memungkinkan Anda untuk melepaskan kedua kejadian mouse menggunakan singkatan yang sama.

Edit 2016:

Masih merupakan pertanyaan yang populer sehingga perlu diperhatikan poin @ Dennis98 di komentar di bawah bahwa di jQuery 1.9+, acara "hover" sudah tidak digunakan lagi karena mendukung panggilan "mouseenter mouseleave" standar. Jadi, deklarasi pengikatan acara Anda sekarang akan terlihat seperti ini:

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

Lepaskan peristiwa mouseenterdan satu mouseleaveper satu atau lepaskan semua peristiwa di elemen.

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

atau

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

unbind () tidak berfungsi dengan kejadian sebaris hardcode.

Jadi, misalnya, jika Anda ingin melepaskan peristiwa gerakan mouse dari <div id="some_div" onmouseover="do_something();">, saya menemukan itu $('#some_div').attr('onmouseover','')adalah cara cepat dan kotor untuk mencapainya.

Solusi lain adalah .die () untuk acara yang dilampirkan dengan .live () .

Ex.:

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

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

Anda dapat menemukan referensi yang bagus di sini: Menjelajahi jQuery .live () dan .die ()

(Maaf untuk bahasa Inggris saya: ">)

Semua hover yang dilakukan di belakang layar mengikat properti mouseover dan mouseout. Saya akan mengikat dan melepaskan fungsi Anda dari acara tersebut satu per satu.

Misalnya, Anda memiliki html berikut:

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

maka jQuery Anda akan menjadi:

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

});

Anda dapat menghapus penanganan kejadian tertentu yang dilampirkan oleh on, menggunakanoff

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

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

Dengan menggunakan ini, Anda hanya akan menghapus handlerFunction
. Praktik baik lainnya, adalah menyetel nameSpace untuk beberapa peristiwa yang dilampirkan

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

Saya menemukan ini berfungsi sebagai argumen kedua (fungsi) ke .hover ()

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

Fungsi pertama (argumen ke .hover ()) adalah gerakan mouse dan akan mengeksekusi kode Anda. Argumen kedua adalah mouseout yang akan melepaskan peristiwa hover dari #yourId. Kode Anda hanya akan dieksekusi sekali.