0

作成中のドロップダウン メニュー専用のイベントを作成しようとしています。それが表示されている場合.is(":visible")、メニュー自体以外の場所をクリックすると、それが閉じます。

- - 編集 - -

これがうまくいかなかったのです。他のコードは正常に機能しました。そして.on()完全に機能していますが、次のコードは私が望むものを与えていません。

$(document).on("mouseout", "#menuPopUp", function(){
   $(document).on("mousedown", function(){
      $("#menuPopUp").hide();
   });
});

#menuPopUpそれ自体以外がクリックされたときに非表示にしようとしています。

4

2 に答える 2

0

この方法を試しましたか：http：//jsfiddle.net/tTkAB/1/

$(document).on("mousedown", "#headerPicMenu", function() {
    if ($("#menuPopUp").is(":visible")) {
       $("#menuPopUp").hide();
    } else {
       $("#menuPopUp").show();
    }
});

$(document).on("mouseout", "#menuPopUp", function() {
    if ($("#menuPopUp").is(":visible")) {
       $("#menuPopUp").hide();
    } else {
       $("#menuPopUp").show();
    }
});

$("#menuPopUp").on('mousedown', function() {
   $(this).mousedown();
});

答えとフィドルを更新しました。

于 2012-12-31T07:12:36.660 に答える
0

マウスオーバー/マウスアウトでクラスを追加/削除してから、クリックイベントでテストしてみてください。これらの行に沿って何か：

$("#menuPopUp").mouseover(function() {
   $(this).addClass("menuover"); 
});

$("#menuPopUp").mouseout(function() {
   $(this).removeClass("menuover"); 
});

$(document).on("mousedown", function(){
    if($("#menuPopUp").is(":visible") && !$("#menuPopUp").hasClass("menuover")) {
        $("#menuPopUp").hide();
    }
});

</p>

于 2012-12-31T07:50:01.430 に答える