jquery - 鼠标移出时尝试鼠标按下

Question

我正在尝试专门为我正在创建的下拉菜单创建一个事件。如果它是可见的.is(":visible")，除了菜单本身之外，任何点击的地方都会关闭它。

- - 编辑 - -

这是行不通的。其他代码工作正常。并且.on()工作得很好，但是下面的代码并没有给我想要的东西。

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

#menuPopUp当单击除自身之外的任何内容时，我试图隐藏。

Answer 1

尝试在 mouseover/mouseout 上添加/删除一个类，然后在 click 事件中对其进行测试；这些方面的东西：

$("#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>

Answer 2

您是否尝试过这种方式：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();
});

更新了答案和小提琴。