如果在外部单击，则隐藏/切换

问题描述

我在这里使用此模板( http://startbootstrap.com/templates/simple- sidebar.html )，以便我进行引导学习.我发现学习非常好.但是我有一个疑问.

I am using this template over here ( http://startbootstrap.com/templates/simple-sidebar.html ) for my startup in bootstrap learning. I am finding it pretty good to learn. However I have a doubt.

当我在移动模式下打开模板时，它显示一个图标(菜单图标)，当我单击它时，它显示侧边栏.现在，当我在div之外单击时，理想情况下它应该隐藏侧边栏(自动切换)，但不隐藏.请让我知道如何解决/实现它.

When I open the template in mobile mode, it shows an icon ( Menu icon), when I click it, it shows the sidebar. Now when I click outside the div, ideally it should hide the sidebar (get toggled automatically) but it doesnt. Please let me know how to tackle / achieve it.

用于切换div的脚本如下:

The script used for toggling the div is as follows :

   $("#menu-toggle").click(function(e) {
    e.preventDefault();
    $("#wrapper").toggleClass("active");
});

如果您在引导程序中有固定的侧边栏演示，请分享.

Also if you have any fixed sidebar demo in bootstrap, please share.

推荐答案

尝试以下方法:

$("#menu-toggle").click(function(e) {
    e.preventDefault();
    $("#wrapper").toggleClass("active");
});

$("#page-content-wrapper").click(function(e) {
    e.preventDefault();
    if $("#wrapper").hasClass("active"){
      $("#wrapper").toggleClass("active");
    }
});

这将允许您在隐藏侧边栏时侦听菜单切换按钮的单击，并在显示侧边栏时侦听其余内容的单击.

This will allow you to listen for the click on the menu-toggle button when the sidebar is hidden and listen for the click on the rest of the content when the sidebar is visible.

这篇关于如果在外部单击，则隐藏/切换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！