移动按钮不工作（引导）

我正在使用jQuery和Bootstrap。如下面的html所述，移动按钮不会展开。我已经在本网站上检查确认数据目标，但没有运气。下面是代码我有，移动按钮不工作（引导）

<!DOCTYPE html> 
<html lang="en"> 

<head> 
<meta charset="utf-8"> 
    <title>name</title> 
<meta name="description" content="name"> 
<meta content="IE=edge" http-equiv="X-UA-Compatible"> 
<meta content="width=device-width,initial-scale=1" name="viewport"> 

<!-- 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"> 

<link rel="stylesheet" href="css/main.css"> 
</head> 

<body> 

<!-- Navbar --> 
<nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
    <div class="container"> 
    <div class="navbar-header"> <!-- Navbar Header --> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand"> name </a> 
    </div> <!-- End Navbar Header --> 

    <div class="collapse navbar-collapse navbar-right" id="navbar"> 
     <ul class="nav navbar-nav"> 
     <li><a href="lastName_OnlineSummary.pdf">PDF</a></li> 
     <li><a href="https://www.linkedin.com/in/username/">LinkedIn</a></li> 
     <li><a href="https://github.com/username">GitHub</a></li> 
     <li><a href="mailto:[email protected]">Contact</a></li> 
     </ul> 
    </div> <!-- End Navbar-collapse --> 
    </div> <!-- End Container --> 
</nav> <!-- End Navbar --> 

<!-- ... --> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 

<script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

</body> 
</html>

来源

2017-07-03 Samuel Kneppel

你必须在** jQuery后加载Bootstrap脚本**。这是因为Bootstrap依赖于jQuery，并且该脚本必须先加载，所以Bootstrap的脚本可以使用它。 – makshh

你的jQuery后加载引导脚本。这是因为Bootstrap依赖于jQuery，并且该脚本必须先加载，所以Bootstrap的脚本可以使用它。 像这样：

<script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

来源

2017-07-03 18:34:25 SimonRi

这解决了我的问题。非常感谢！ –

移动按钮不工作（引导）

回答

相关问题