文档单击以隐藏菜单 [英] document click to hide menu

问题描述

当我单击菜单外的文档时，我的文档单击功能没有隐藏我的菜单.当我单击img时，它会显示菜单，当我再次单击img时，它会隐藏菜单，但是当我单击文档时，我希望它隐藏菜单，是否有人知道我在做错什么以及如何制作它工作.

My document click function isn't hiding my menu when I click the document outside of my menu. When I click the img it shows the menu and when I click the img again it hides it but when I document click I want it to hide the menu does any one know what I'm doing wrong and how to make it work.

var visible = false;
var id = $(this).attr('id');

$(document).not('#' + id + ' div:eq(1)').click(function () {
    if (visible) {            
        $('.dropdownlist .menu').hide();
        visible = false;
    }
});    


$(this).find('div:eq(1)').click(function (e) {
     var menu = $(this).parent().find('.menu');

     if (!visible) {
         menu.show();
         visible = true;
     } else if (visible) {
         menu.hide();
         visible = false;
     }
     menu.css({ 'left': $(this).position().left + $(this).width() - menu.find('ul').width(), 
                'top': $(this).position().top + $(this).height() });
 })

推荐答案

我遇到了类似的问题，并使用以下代码解决了该问题:

I had a similar problem and solved it with the following code:

$("body").mouseup(function(){ 
    if (visible) {
        $('.dropdownlist .menu').hide();
         visible = false;
    }
});

代替您的$(document).not(..代码.

这篇关于文档单击以隐藏菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！