0

これは私が持っているものです:

$('#blah').hover(function(){
    $('etc').show();
}, function(){
    $('etc').hide();
});

これは問題なく機能します。今度は、上記のコードをon()メソッドでライブで機能させたいと思います。

$('#blah').on('hover', function(){
    $('#etc').show();
}, function(){
    $('#etc').hide();
});

しかし、これは機能していません、誰もが理由を知っていますか?しかし、これも機能します:

$('#blah').on('hover', function(){
    $('#etc').show();
});

on()メソッドを使用しているとき、コールバック関数が機能していないので、on()でmouseover()とmouseleave()を使用していて、機能しています。ホバーコールバックがで機能しない理由を知りたいだけです。 ()、これは2つのイベントを使用するよりも簡単です。

ありがとう

4

7 に答える 7

3

Jquery ドキュメントから。Jquery on

jQuery 1.8 で非推奨: 「hover」という名前は、文字列「mouseenter mouseleave」の短縮形として使用されます。この 2 つのイベントに対して 1 つのイベント ハンドラーをアタッチし、ハンドラーは event.type を調べて、イベントが mouseenter または mouseleave のどちらであるかを判断する必要があります。"hover" 疑似イベント名を、1 つまたは 2 つの関数を受け入れる .hover() メソッドと混同しないでください。

$("div.test").on({
  mouseenter: function(){
    $(this).addClass("inside");
  },
  mouseleave: function(){
    $(this).removeClass("inside");
  }
});
于 2013-03-01T09:54:22.547 に答える
2

JQueryソースコードから、 JQueryhoverにつながるトリガーとなったイベントリストに含まれていません.on()

jQuery.each( ("blur focus focusin focusout load resize scroll unload click dblclick " +
    "mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave " +
    "change select submit keydown keypress keyup error contextmenu").split(" "), function( i, name ) {

    // Handle event binding
    jQuery.fn[ name ] = function( data, fn ) {
        return arguments.length > 0 ?
            this.on( name, null, data, fn ) :
            this.trigger( name );
    };
});

これは.hover()、JQuery.mouseenter().mouseleave()

jQuery.fn.hover = function( fnOver, fnOut ) {
    return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
};

この簡単な説明がほとんど参考にならないことを願っています。

于 2013-03-01T10:05:39.943 に答える
1

ホバーには mouseenter と mouseleave を使用します。on here でホバーを使用して確認します。

$("#blah").on(
{
    mouseenter: function() 
    {
        //stuff to do on mouseover
    },
    mouseleave: function()
    {
        //stuff to do on mouseleave
    }
});

トグルを使用して表示/非表示を切り替え、

$('#blah').on('hover', function(){
    $('#etc').toggle();
});
于 2013-03-01T09:51:25.620 に答える
1

これhoverは、実際にはブラウザー イベントではないためです。実際には、呼び出しの省略形にすぎません。

 $(selector).mouseenter(handlerIn).mouseleave(handlerOut);

.on('hover')フォームでの使用は、バージョン 1.8 で非推奨になりました。

于 2013-03-01T09:52:02.747 に答える
0

使用する

 jQuery.on("hover","#blah", function..)

または、jQueryのトグル機能を使用することもできます

于 2013-03-01T09:50:26.190 に答える
0

トグル()を使う

$('#blah').on('hover', function(){
   $('#etc').toggle();
});
于 2013-03-01T09:52:04.780 に答える
0

はい、それは機能しません。なぜなら、thenイベントを使用する.on()と、コールバック関数が 1 つしかないため、代わりに複数のイベントを使用できるからです。hoverhover.on()

試す

$("DOM").on({
    mouseenter: function() {
        // Handle mouseenter...
    },
    mouseleave: function() {
        // Handle mouseleave...
    }
});
于 2013-03-01T09:51:06.643 に答える