Question

大家好，我正在学习bootstrap css，我有以下html但由于某种原因，菜单上的下拉菜单不会下降。谁能告诉我为什么？

感谢

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
    <title></title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="/css/bootstrap.min.css" />
    <!-- Optional theme -->
    <link rel="stylesheet" href="/css/bootstrap-theme.min.css" />
    <!-- Latest compiled and minified JavaScript -->
    <script src="/Scripts/jquery-2.0.3.min.js"></script>
    <script src="/Scripts/bootstrap.js"></script>
</head>
<body>
    <form method="post" action="./" id="form1">
        <div class="container">
            <div class="navbar">
                <div class="navbar-inner">
                    <ul class="nav nav-pills">
                        <li><a href="/">Home</a></li>
                        <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Login<b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li>
                                    <a id="LoginLink"></a>

                                    <ul style="width: 260px;" id="searchUl">
                                        <li>
                                            <div id="topSearchDropDownDiv">
                                                <p>
                                                    <label>Email address</label><input name="TxtUserName" type="text" id="LoginControl_TxtUserName" />
                                                </p>
                                                <p>
                                                    <label>Password</label><input name="TxtPassword" type="text" id="LoginControl_TxtPassword" />
                                                </p>
                                                <p>
                                                    <input type="submit" name="LoginBtn" value="Login" id="LoginControl_LoginBtn" class="btn-primary" />
                                                </p>
                                            </div>
                                        </li>
                                    </ul>

                                </li>
                            </ul>
                        </li>
                        <li><a href="/register.aspx">Register</a></li>
                        <li><a href="/link1.aspx">link1</a></li>
                        <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Checker<b class="caret"></b></a>
                            <ul style="width: 260px;" id="CheckUl" class="dropdown-menu">
                                <li>
                                    <div id="Div1">
                                        <p>
                                            <label>Enter your number</label><input name="TxtNumber" type="text" id="TxtNumber" />
                                        </p>
                                        <p>
                                            <input type="submit" name="CheckNow" value="Check now" id="CheckNow" />
                                        </p>
                                    </div>
                                </li>
                            </ul>

                        </li>
                        <li><a href="/forsale.aspx">For sale</a></li>
                        <li><a href="/code.aspx">Code</a></li>
                        <li><a href="/link2.aspx">link2</a></li>
                    </ul>
                </div>
                <div class="row">
                    <h1>Welcome</h1>
                    <div class="row">
                        <p>Welcome</p>
                    </div>
                </div>
            </div>
        </div>
    </form>
    <script src="/js/bootstrap.min.js"></script>
</body>
</html>

Answer 1

尝试删除

<script src="/js/bootstrap.min.js"></script>

因为它被包括两次。如果这不起作用，请提供控制台输出（chrome - ＆gt; F12 - ＆gt;控制台）

Answer 2

工作正常：

Demo here

但是，您包含两倍的bootstrap javascript文件：

<script src="/Scripts/bootstrap.js"></script>

和

<script src="/js/bootstrap.min.js"></script>

尝试删除其中一个。

bootstrap下拉菜单无法正常工作

2 个答案: