Question

我在StackOverflow上遇到了很多类似的问题，但列出的解决方案都没有解决我的问题。（ Bootstrap dropdown closing when clicked

）

我有一个水平导航栏，最后想要一个下拉列表来登录。但是，当您在表单内部单击时，单独关闭铅锤。

有人能帮帮我吗？

非常感谢。我的代码：

<head runat="server">
<%--<link href="../Styles/Estilos.css" rel="Stylesheet" media="all" type="text/css" />--%>
<link href="../Styles/Print_Screen.css" rel="Stylesheet" media="print" type="text/css" />
<link href="../Content/CSS/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="../Content/CSS/jasny-bootstrap.min.css" rel="stylesheet" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<asp:ContentPlaceHolder ID="head" runat="server">
    <script type="text/javascript">

        $(function () {
            // Setup drop down menu
            $('.dropdown-toggle').dropdown();

            // Fix input element click problem
            $('.dropdown input, .dropdown label').click(function (e) {
                e.stopPropagation();
            });

            $('.dropdown-menu input, .dropdown-menu label').click(function (e) {
                e.stopPropagation();
            });

            $('.dropdown-menu input').click(function (event) {
                event.stopPropagation();
            });

            $('.dropdown-menu').on('click', function (e) {
                e.stopPropagation();
            });

            $('.dropdown-menu').find('form').click(function (e) {
                e.stopPropagation();
            });

            $('.dropdown-menu').click(function (e) {
                e.stopPropagation();
            });

        })        
    </script>
</asp:ContentPlaceHolder>
<div class="page-header" style="margin: 10px 0 20px;">
    <div id="Div1" class="container">
        <div class="navbar-inner navbar-content-center" style="text-align: center;">
            <img id="Img3" alt="" style="border: 0" runat="server" src="~/images/logo.png" />
        </div>
    </div>
</div>

<div class="navbar navbar-default" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" 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><span class="icon-bar">
                </span><span class="icon-bar"></span>
            </button>
        </div>
        <div class="navbar-collapse collapse">
            <asp:SiteMapDataSource ID="menuData" runat="server" ShowStartingNode="false" />
            <asp:Repeater ID="r1" runat="server" DataSourceID="menuData">
                <HeaderTemplate>
                    <ul class="nav navbar-nav">
                </HeaderTemplate>
                <ItemTemplate>
                    <li id="Menuitem" runat="server"><a href='<%# ((System.Web.SiteMapNode)Container.DataItem).Url %>'>
                        <i class='<%#((System.Web.SiteMapNode)Container.DataItem).ResourceKey%>'></i>
                        <%#((System.Web.SiteMapNode)Container.DataItem).Title%></a> </li>
                </ItemTemplate>
                <FooterTemplate>
                    </ul>
                </FooterTemplate>
            </asp:Repeater>
            <form class="form" id="formLogin" runat="server">
            <ul class="nav navbar-nav navbar-right">
                <li id="liLogin" runat="server" class="dropdown"><a href="#" class="dropdown-toggle"
                    id="register" data-toggle="dropdown" style="padding: 20px 5px;"><i class="glyphicon glyphicon-cog">
                    </i>LOGIN</a>
                    <div class="dropdown-menu" style="padding: 17px;">
                        <div style="margin-bottom: 25px" class="input-group input-group-sm">
                            <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                            <asp:TextBox ID="txtLogin" runat="server" class="form-control" placeholder="username or email"
                                Style="width: 200px;"></asp:TextBox>
                        </div>
                        <div style="margin-bottom: 25px" class="input-group input-group-sm">
                            <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                            <asp:TextBox ID="txtSenha" runat="server" TextMode="Password" class="form-control"
                                placeholder="username or email" Style="width: 200px;"></asp:TextBox>
                        </div>
                        <div style="margin-top: 10px" class="form-group">
                            <!-- Button -->
                            <div class="col-sm-12 controls">
                                <asp:LinkButton ID="btnLogin" runat="server" Text="Login" CssClass="btn btn-success btn-sm btn-block"></asp:LinkButton>
                            </div>
                            <asp:Label ID="errorLabel" runat="server" Text="" Visible="false"></asp:Label>
                        </div>
                    </div>
                    <!-- /dropdown-menu -->
                </li>
            </ul>
            <asp:ScriptManager ID="ScriptManager2" runat="server">
            </asp:ScriptManager>
            </form>
        </div>
    </div>
    <!--/.nav-collapse -->
</div>

 <script src="../Scripts/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="../Scripts/bootstrap.min.js" type="text/javascript"></script>
<script src="../Scripts/jasny-bootstrap.min.js" type="text/javascript"></script>

单击内部输入时Bootstrap DropDown关闭

0 个答案: