Javascript菜單關閉

我在HTML中有一個菜單。當你點擊「菜單」時，一個列表打開，再次點擊「菜單」，列表關閉。Javascript菜單關閉

我需要的菜單關閉，如果用戶點擊屏幕

<script type="text/javascript"> 
$(function() { 
    var menuVisible = false; 

    $('#menuBtn').click(function() { 
    if (menuVisible) { 
     $('#menu').css({ 
     'display': 'none' 
     }); 
     menuVisible = false; 
     return; 
    } 
    $('#menu').css({ 
     'display': 'block' 
    }); 
    menuVisible = true; 
    }); 
    $('#menu').click(function() { 
    $(this).css({ 
     'display': 'none' 
    }); 
    menuVisible = false; 
    }); 
});

來源

2016-06-12 Sam

的可能的複製[jQuery的：通過單擊DIV本身的任何地方除了關閉DIV（http://stackoverflow.com/questions/6610022/jquery-close-div-by-clicking-anywhere-apart - 從這個div本身） –

創建一個onclick偵聽文件應該是足夠的任何地方：

document.onclick = myClickAnywhereHandler; 
function myClickAnywhereHandler() { 
    alert("hide the menu"); 
    $('#menu').css({ 
    'display': 'none' 
    }); 
}

來源

2016-06-12 23:26:53

這使整個事情不工作夥計 – Sam

下面是簡單的HTML和jquery。希望它能幫助你。

的Html -

<div class="container"> 
    <button id="menu">menu</button> 
    <div id="list">list</div> 
</div>

的jQuery -

$('#menu').click(function(e) { 
    e.stopPropagation(); 
    $('#list').slideToggle(); 
}) 
$('#list').click(function(e) { 
    e.stopPropagation(); 
}); 
$('body').click(function() { 
    $('#list').slideUp(); 
})

名單將toggle上的菜單中點擊slideUp身體上的點擊。

的jsfiddle - https://jsfiddle.net/dhananjaymane11/Lgfdmjgb/1/

來源

2016-06-13 06:01:08 DJAy

jQuery的.toggle功能切換的元件的可見性，與所述布爾值邏輯的代碼是不必要的。

只要在文檔內點擊一下，就可以在菜單上撥打.toggle。

$(document).click(function(){ 
    $("#menu").toggle(); 
});

來源

2016-06-13 06:13:33 JackHasaKeyboard

Javascript菜單關閉

回答

相關問題