jquery - 当用户触摸菜单以外的屏幕表面的任何部分时，如何关闭响应式引导菜单？

Question

我正在使用 Bootstrap 框架 v2.0.1 来设计我的网站。当在 iPad、iPhone、平板电脑、智能手机等设备(不是电脑、台式机和笔记本电脑)上浏览网站时，菜单项会折叠成一个图标并放置在屏幕的右上角。如果用户单击此图标，菜单将展开，如果用户希望他/她可以选择所需的菜单项，则链接到该菜单项的页面将打开，展开的菜单将关闭。这是我网站的当前功能，并且运行良好。

现在我面临的问题是，如果用户点击菜单图标，打开菜单(即菜单被展开)，现在他/她触摸了屏幕表面的任何地方，除了展开的菜单菜单应该再次折叠(缩小或关闭)。

我该如何实现？如果您想从我这边获得有关此问题的更多信息，请告诉我。

谢谢。

Answer 1

尝试使用此代码:编辑:如果你的菜单有 .nav-collapse 类，你可以使用这个:

$("body").click(function(e){ // When we click in body (all clicks are in the body ) we detect what element we are clicking.
    if ($(e.target).hasClass(".nav-collapse")){ //if the element is not our menu (#menu), we use closemenu function (we close our menu)
        closemenu();
    };
});

function closemenu(){
 // close your menu
 $('.nav-collapse').collapse('hide');
}