2016-12-26 72 views
0

每當我單擊摺疊按鈕時,什麼都不會發生。我已經在我的兩臺筆記本電腦上進行了檢查,所以我猜想網絡瀏覽器沒有問題。引導程序摺疊按鈕不起作用

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>QPZONE</title> 
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
</head> 

<body> 
    <nav class="navbar navbar-inverse navbar-static-top" role="navigation"> 
     <div class="container-fluid"> 
     <a class="navbar-brand" href="index.html">QPZONE</a> 

     <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse"> 

     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 



     <div class="collapse navbar-collapse navHeaderCollapse"> 
     <ul class="nav navbar-nav navbar-right"> 
     <li><a href="index.html">Home</a></li> 
     <li><a href="index.html">1st Year</a></li> 
     <li><a href="index.html">2nd Year</a></li> 
     <li><a href="index.html">3rd Year</a></li> 
     <li><a href="index.html">4th Year</a></li> 
     </ul> 
     </div> 


    </nav>   
    <script type="js/jquery.js"></script> 
    <script type="js/bootstrap.min.js"></script> 

</body> 
</html> 
+0

您是否安裝了所需的依賴項?確保在'js'文件夾中有'jquery.js'和'bootstrap.min.js'。另外,您是否知道如何通過按Ctrl + Shift + J或Ctrl + Shift + I查看錯誤日誌來訪問開發者控制檯?錯誤日誌會讓你知道是什麼導致了問題。如果你不明白,請在這裏複製/粘貼錯誤,我們可以幫助你。 – LStarky

+0

Raunak,你能解決這個問題嗎? – LStarky

回答

0

檢查它的工作正常,請檢查所有的CSS和jQuery文件存在。 複製下面的代碼並運行它工作正常。

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>QPZONE</title> 
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
</head> 

<body> 
    <nav class="navbar navbar-inverse navbar-static-top" role="navigation"> 
     <div class="container-fluid"> 
     <a class="navbar-brand" href="index.html">QPZONE</a> 

     <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse"> 

     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 

     <div class="collapse navbar-collapse navHeaderCollapse"> 
     <ul class="nav navbar-nav navbar-right"> 
     <li><a href="index.html">Home</a></li> 
     <li><a href="index.html">1st Year</a></li> 
     <li><a href="index.html">2nd Year</a></li> 
     <li><a href="index.html">3rd Year</a></li> 
     <li><a href="index.html">4th Year</a></li> 
     </ul> 
     </div> 
    </nav>   
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 

</body> 
</html> 
+0

您是否對代碼進行了任何更改?只需重新複製問題代碼,實際上您提供的解決方案並不明顯。 – LStarky

+0

非常感謝你。其實我只是把這個錯誤與腳本部分分開了。 –

0

1.檢查相關

你已經安裝了所需的依賴?確保jquery.jsjs文件夾中的bootstrap.min.js和css文件夾中的bootstrap.min.css

2.檢查錯誤日誌

你知道如何通過按Ctrl + Shift + J鍵或按Ctrl + Shift + I看到錯誤日誌訪問開發者控制檯?錯誤日誌會讓你知道是什麼導致了問題。如果你不明白,請在這裏複製/粘貼錯誤,我們可以幫助你。