Question

我尝试在导航栏中设置下拉列表，但我无法使其正常工作。当我点击帐户按钮时，它只会在标题中添加一个＃。我尝试将bootstrap-dropdown链接到文件中，我添加了一个javascript但没有任何作用。我对模态有同样的问题。继承我的代码：

<!DOCTYPE html>
<html>
<head>
        <title>Dropdown Test!</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link href="css/bootstrap-modal.css" rel="stylesheet" />
        <link href="css/bootstrap.css" rel="stylesheet" />
        <script type="text/javascript" src="includes/jscript/jquery.js"></script>



<div class="container">


<div class="navbar">
    <div class="navbar-inner">
        <div class="container-fluid">
            <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                  </a>
            <a class="brand" name="top">Dropdown Test</a>
              <div class="nav-collapse collapse">
                <ul class="nav">
                                   <li class="divider-vertical"></li>
                    <li class="active"><a href="">Home</a></li>
                    <li><a href="#">Client Area</a></li>
                                        <li><a href="contact">Contact</a></li>
                                     </ul>
                           <ul class="nav pull-right">
                       <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Account&nbsp;<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                       <li><a href="clientarea.php">Login</a></li>
                       <li><a href="register.php">Register</a></li>
                       <li class="divider"></li>
                       <li><a href="pwreset.php">Forgot Password?</a></li>
                </ul>
              </li>
                </ul>   
     </div>
      </div>
   </div>
</div>



<link href="bootstrap/css/bootstrap.css" rel="stylesheet" media="screen">
<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript" src="bootstrap/js/bootstrap-dropdown.js"></script>


  <style type="text/css">


body
{
margin:0;
padding:0;
background-color: #999;
}

.navbar {
  margin-left: 5%;
  margin-right: 5%;
  margin-top: 2%;
}

</style>
</body>
</html>

Answer 1

你错过了这里的剧本

<script type="text/javascript">  
    $(document).ready(function () {  
        $('.dropdown-toggle').dropdown();  
    });

Answer 2

您有两个对jquery的引用。删除底部。

Bootstrap下拉列表不起作用。尝试了一切...（bootstrap 2.3.2）

2 个答案: