collapse expands my navbar menu but won't collapse it

"Bootstrap toggle-collapse expands my navbar menu but won't collapse it."

I've tried messing with the classes and data-target and adding extra script to no avail. The menu expands, then when toggled again it sometimes appears to flicker like it drops down and is immediately open again but most of the time nothing seems to happen. In the Chrome inspector aria=true never becomes false. It appears like it would change but always remains true.

My scripts are located in a separate layout file but they are working. All other functionality works and this even works halfway.

Here's the current code:

<nav class="navbar navbar-fixed-top">
<div class="container">
    <div class="navbar-header">

        <a href="#" class="navbar-toggle"><i class="fa fa-lock"></i></a>

        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="#navbar">
            <span class="fa fa-bars"></span>
        </button>
        <a class="navbar-brand" href="{{ path('homepage') }}"><img src="{{ asset('img/logo-blue.png') }}" alt="Podify" /></a>
    </div>

    <div id="navbar" class="navbar-collapse collapse" role="navigation">

        {{ mopa_bootstrap_menu('AppBundle:Builder:mainMenu', { 'automenu': 'navbar' }) }}
        <!--
        <ul class="nav navbar-nav">
            <li role="presentation" class="active"><a href="/features">Features <span class="sr-only">(current)</span></a></li>
            <li role="presentation"><a href="#pricing">Pricing <span class="sr-only">(current)</span></a></li>
            <li role="presentation"><a href="#contact">Contact <span class="sr-only">(current)</span></a></li>
        </ul>
        -->
        <ul class="nav navbar-right nav-pills hidden-xs">
            <li class="active"><a href="#"><i class="fa fa-lock"></i> Login</a></li>
            <li><a href="#">Join</a></li>
        </ul>
    </div><!--/.navbar-collapse -->
</div>

My code doesn't show the nav tag closed for some reason here but i see it when editing my post.

I imagine it's something simple i'm overlooking. Any help will of course be greatly appreciated!

---

<script src="http://code.jquery.com/jquery-2.2.4.min.js"
    integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>

这个Jquery支持切换功能。

链接地址: http://www.djcxy.com/p/83682.html

上一篇: 禁止Twitter Bootstrap模式窗口关闭

下一篇: 折叠展开我的导航栏菜单，但不会折叠它