2

誰でも私を助けることができますか？mouseenterイベントとmouseleaveイベントのアニメーションを含むドロップダウンメニューが必要ですが、マウス入力後にクリックすると、ページ内の任意の場所（例では本文のみ）が新しくクリックされるまでサブメニューが表示されたままになります。その2回目のクリック（mouseleaveの同じアニメーション）の後、始めたときと同じように、mouseenterとmouseleaveをもう一度オンにします。

$('#menu > li').on('mouseenter',function(){
    //mouseenter handler
});

$('#menu > li').on('mouseleave',function(){
    //mouseleave handler
});
$('#menu > li').toggle(
  function () {
  $('#menu > li').off('mouseenter mouseleave');
  },
  function () {
  //mouseleave handler
  });
$('body').click(function(){
  //same mouseleave handler
});

2回目のクリック後にmouseenter/mouseleaveを有効にする方法がわかりません。申し訳ありませんが、ありがとうございます。

4

1 に答える 1

1

これは、イベント委任を使用して大幅に簡素化できます。

$('document').on("click",'#menu > li', function() {
    $('#menu > li').off('mouseenter mouseleave');
});

$('document').on("click",':not(#menu > li)', function() {
    $('#menu > li').on('mouseenter', function(){
         //your mouseenter handler goes here
    });
    $('#menu > li').on('mouseleave', function(){
         //your mouseleave handler goes here
    });
});

これは意味的に次のものと同等です。

If a click happens on a menu item, unbind mouse enter/leave events

If a click happens on a non menu item, bind mouse enter/leave events
于 2012-11-27T14:19:29.533 に答える