1. ホーム
  2. javascript

[解決済み] ホバー時のJqueryが機能しない

2022-02-01 18:17:32

質問

jQuery 1.8と互換性があるようにコードを変更しているのですが、以下のように行き詰っています。 hover というのはうまくいきません。同じことを click は動作しました。以下は私のコードです。どこが間違っているのか、どなたか教えていただけませんか?

$(document).on('hover', '.top-level', function (event) {
  $(this).find('.actionfcnt').show();
  $(this).find('.dropfcnt').show();
}, function () {
  $(this).find('.dropfcnt').hide('blind', function () {
    $('.actionfcnt').hide();
  });
});

解決方法は?

jQuery 1.8で非推奨となりました。 : mouseenter mouseleave"の省略形として使用される名前 "hover" です。この2つのイベントに対して1つのイベントハンドラがアタッチされ、ハンドラは event.type を調べてイベントが mouseenter か mouseleave かを判断する必要があります。 混同しないように hover"擬似イベント名と .hover() メソッドは、1つまたは2つの関数を受け付けます。

出典 http://api.jquery.com/on/#additional-notes

そのため、quot;hover"を使用することはできません。

$(document).on('mouseenter','.top-level', function (event) {
    $( this ).find('.actionfcnt').show();
    $( this ).find('.dropfcnt').show();
}).on('mouseleave','.top-level',  function(){
    $( this ).find('.dropfcnt').hide('blind', function(){
        $('.actionfcnt').hide();
    });
});