下拉列表不顯示

我無法讓我的下拉菜單正常工作。我可以讓導航欄完美顯示，但是當我點擊「Dropdown」（其中任何一個）時，它不會顯示下拉菜單。我試圖在其他文章上看到這個，但沒有什麼能夠解決所有人的問題。這裏下面是我的代碼請提前告訴我的問題和感謝。下拉列表不顯示

<!doctype html> 
<html class = "no-js" ng-app = "app" lang = "en"> 
<head> 
    <meta charset = "utf-8"> 
    <title ng-bind = "title"> </title> 
    <meta name = "description" content = ""> 
    <meta name = "viewport" content = "width = device-width"> 
    <link rel = "stylesheet" href = "http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/> 
    <link rel = "stylesheet" href = "styles/main.css"> 

    <link rel = "stylesheet" href = "http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css"> 
    <link rel = "stylesheet" href = "http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> 

<head profile = "http://www.w3.org/2005/10/profile"> 
    <meta name="google-signin-scope" content="profile email"> 

    <style> 
     body { 

      background-size: cover; 
      background-position: top center; 
     } 
    </style> 
</head> 

<body> 
<div class = "container" > 
    <header class = "header"> 
     <div id="headerText" style="visibility: hidden"> 
      <span style="font-family: calibri; font-size: 30pt;"> </span> 
      <nav id = "top-nav" class = "pull-right"> 
       <ul class = "nav nav-pills"> 



        <li id = "reports" disabled> 
         <a ng-href = "#/reports"> Reports 
          <span class = "visuallyhidden" class="btn btn-primary pull-right"> - currently selected </span> 
         </a> 
        </li> 


        <li class="dropdown"> 
         <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a> 
         <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"> 
          <li><a tabindex="-1" href="#">Action</a></li> 
          <li><a tabindex="-1" href="#">Another action</a></li> 
          <li><a tabindex="-1" href="#">Something else here</a></li> 
          <li class="divider"></li> 
          <li><a tabindex="-1" href="#">Separated link</a></li> 
         </ul> 
        </li> 
       </ul> 
      </nav> 
     </div> 
    </header> 
</div> 

<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script> 
<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-resource.js"></script> 
<script src = "scripts/app.js"></script> 
<script src = "scripts/controllers.js"></script> 
<script src = "http://code.jquery.com/jquery-2.1.1.min.js"></script> 
<script src = "http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> 
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script src = "http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
<script src = "http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src = "http://code.highcharts.com/highcharts.js"></script> 
<script src = "http://code.highcharts.com/modules/exporting.js"></script> 
<script src="https://code.highcharts.com/highcharts-3d.js"></script> 

<script src = "https://apis.google.com/js/client.js"></script> 
<script src = "http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script> 
<script src = "http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 
<script src = "http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script> 
<script src = "http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/3.0.0/js/bootstrap-datetimepicker.min.js"></script> 
<script src = "http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.4.0/lang/en-gb.js"></script> 
</body> 
</html>

來源

2015-12-28 avi

https：//開頭的角-ui.github.io/bootstrap/#/dropdown請參閱這個 –

謝謝我閱讀過這個文檔並且嘗試了這個例子，但是它並沒有在我上面的例子中工作。 – avi

你沒有在你的腳本中包含ui-bootstrap的庫，首先請包括ui-bootstrap.js –

你還沒有爲你的腳本界面，引導庫，請先包括UI的bootstrap.js腳本，之後注入的依賴關係如下

angular.module('myModule', ['ui.bootstrap']);

來源

2015-12-29 07:28:21

下拉列表不顯示

回答

相關問題