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年を編集：

まだ人気のある質問なので、jQuery 1.9以降では、標準の「mouseenter mouseleave」呼び出しに代わって「hover 」イベントが廃止されたという以下のコメントの@ Dennis98のポイントに注目する価値があります。したがって、イベントバインディング宣言は次のようになります。

$('#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','')がわかりました。

別の解決策は、.live（）を使用してアタッチされたイベントの.die（）です。

例：

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

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

ここで良い参照を見つけることができます：jQuery .live（）と.die（）の探索

（私の英語で申し訳ありません： ">）

すべてのホバーが舞台裏で行っていることは、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);
  });

});

onを使用して、によって添付された特定のイベントハンドラを削除できます。off

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

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

これを使用して、handlerFunctionのみを削除します
別の良い方法は、複数の添付イベントに名前空間を設定することです

$("#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（）の2番目の引数（関数）として機能することがわかりました

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

最初の関数（.hover（）の引数）はマウスオーバーで、コードを実行します。2番目の引数はマウスアウトで、ホバーイベントを#yourIdからバインド解除します。コードは1回だけ実行されます。