2016-06-11 73 views
0

即使在包含所有腳本文件後,下面給出的代碼仍然無法正常工作。我看不到面板上的切換。 需要添加哪些代碼?爲什麼下面的代碼不會切換面板?

<html> 
    <head> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.js"></script> 
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.3.3.js"></script> 
    <script src="example.js"></script> 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> 
    </head> 
    <body> 
    <div class="row aet-content-fluid"> 
      <div class="panel-group ud-accordion" id="accordion" role="tablist" aria-multiselectable="true"> 
       <div class="panel panel-default"> 
        <div class="panel-heading" role="tab" id="headingOne"> 
         <div class="panel-title"> 
          <h2> 
           <a role="button" data-parent="#accordion" 
             data-toggle="collapse" href="javascript:void(0);#tab1" aria-controls="tab1" 
             class="" aria-expanded="false"><span>Office Information</span> 
           </a> 
          </h2> 
         </div> 
        </div> 
         <div id="tab1" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne"> 
          <div class="panel-body office-detail-panelBody"> 
        This content is straight in the template. 
       </div> 
      </div> 
     </div> 
     </div> 
    </div> 
    </body> 
</html> 

回答

0

我花了一段時間,但似乎問題在於你包含的腳本。 首先你需要一個jQuery包含。 第二:訂單很重要。

當我設置<head>部分:

<head> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.js"></script> 
    <script src="example.js"></script> 
    </head> 

它的工作!三個第一包含(鏈接和兩個腳本)是引導創建者推薦的順序。

相關問題