Bootstrap:Jquery:NavBar:折叠所有链接,包括下拉切换

时间:2020-10-28 17:59:59

标签: jquery bootstrap-4

我有一个引导导航栏,如下所示:

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
    <div class="navbar-header nav-tabs" style="border-bottom:none;">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    </div>
    <div class="navbar-collapse collapse">
       <ul class="nav navbar-nav navbar-right" style="padding-top:20px">
           <li>
        <a href="" class="dropdown-toggle" data-toggle="dropdown">
            Information&nbsp;<span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
            <li>
                <a href="/Home/Terms">Terms &amp; Conditions</a>
            </li>
            <li>
                <a href="/Home/Privacy">Privacy Policy</a>
            </li>
            <li>
                <a href="/Home/ContactUs">Contact Us</a>
            </li>
        </ul>
        </li>
        </ul>
    </div>
</div>

在导航栏菜单之外单击时,我折叠菜单,如下所示:

$("body").on('click', function(event){
    var container = $(".navbar");    
    if (!container.is(e.target) && container.has(e.target).length === 0) 
    {
        container.collapse('hide');
    }
});

在外部单击时,下拉菜单链接会折叠;但是,我也该如何折叠“信息”(drop-toggle)链接? 任何帮助表示赞赏。

编辑:看了帖子 How to close an open collapsed navbar when clicking outside of the navbar element in Bootstrap 3?

该解决方案似乎在Bootstrap编译器中对我有用,但是,即使我在导航栏中单击,它也会折叠菜单。我该如何解决这个问题?

$(document).click(function (event) {
    var clickover = $(event.target);
    var _opened = $(".navbar-collapse").hasClass("navbar-collapse collapse in");
    //if (_opened === true && !clickover.hasClass("navbar-toggle")) {
    if (_opened === true && !clickover.hasClass("navbar-toggle")) {            
        $("button.navbar-toggle").click();
    }
});

1 个答案:

答案 0 :(得分:0)

https://dotnetfiddle.net/qMDjF5

查看

def lists_to_dict(keys, values): 
    out_dictionary = {}
    for idx, key in enumerate(keys):  ## idx will be an integer as index of keys
        out_dictionary[key] = values[idx] ## assumes values and keys is equal length
    return out_dictionary