Bootstrap 3 does not collapse navbar on mobile or tablet size

Question

I'm trying to make the navbar collapsible but for some reason it collapse and close its self very fast.
Here is my code:

    <div class="navbar navbar-inverse navbar-static-top">
        <div class="container">
            <a href="#" class="navbar-brand">
                <img class="logo" src="../img/logo.png" /></a>
            <div class="navbar-header">
                <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
                    <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
                </button>
            </div>
            <div class="collapse navbar-collapse navHeaderCollapse">
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="../Default.aspx">Home</a></li>
                    <li><a href="../Library/Library.aspx">Library</a></li>
                    <li><a href="../About.aspx">About</a></li>
                    <li><a href="#contact" data-toggle="modal">Contact</a></li>
                    <li>
                        <asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
                            <AnonymousTemplate>
                                <a href="#login" id="HeadLoginStatus" runat="server" data-toggle="modal">Log In</a>
                            </AnonymousTemplate>
                            <LoggedInTemplate>
                                <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Settings<span class="caret"></span></a>
                                    <ul class="dropdown-menu" role="menu">
                                        <li role="presentation" class="dropdown-header"><asp:LoginName ID="HeadLoginName" runat="server" /></li>
                                        <li><a href="#">Accounts</a></li>
                                        <li><a href="#"><asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect" LogoutText="Log Out" LogoutPageUrl="~/" /></a></li>
                                    </ul>
                                </li>
                            </LoggedInTemplate>
                        </asp:LoginView>
                    </li>
                </ul>
            </div>
        </div>
    </div>

Can someone tell me whats the problem with it?

Answer 1

将您的“按钮”更改为“ div”标签，这将防止发回邮件。