BootStrap 下拉菜单点击之后不会出现下拉菜单(下拉菜单不弹出)的解决方案
最近学到Bootstrap下拉菜单，学懂了教程内容之后自己敲一个点击按钮底下弹出下拉菜单的小demo，写完代码发现运行之后点击按钮没反应，下拉菜单弹不出来，对照教程感觉代码没错。
我的代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>下拉菜单</title>
<link rel="stylesheet" href="../libs/bootstrap-3.3.7/css/bootstrap.css">
<script type="text/javascript" src="../libs/bootstrap-3.3.7/js/bootstrap.js"></script>
<script type="text/javascript" src="../libs/jquery-3.1.1.js"></script>
</head>
<body>
<div class="container" style="margin-top: 20px">
<div class="dropdown">
<button class="btn dropdown-toggle" id="mydropdownmenu" data-toggle="dropdown">点击弹出下来菜单</button>
<ul class="dropdown-menu" aria-labelledby="mydropdownmenu" role="menu">
<li role="presentation"><a role="menuitem" href="#">1</a></li>
<li role="presentation"><a role="menuitem" href="#">2</a></li>
<li role="presentation"><a role="menuitem" href="#">3</a></li>
<li role="presentation"><a role="menuitem" href="#">4</a></li>
<li role="presentation"><a role="menuitem" href="#">5</a></li>
</ul>
</div>
</div>
</body>
</html>
试着贴教程中的代码，能正确运行，然后试着只将body中代码替换成教程代码，则不能正确运行。问题锁定在引入的脚本文件中。对照教程中使用的远程服务器上的文件，发现bootstrap.js和jquery-3.1.1.js引入的顺序跟我的demo引入的顺序不同。他是先引入jquery-3.1.1.js之后再引入bootstrap.js。
opera浏览器中【检查元素】打开运行网页的控制台，发现报红，如下：
大概说的是bootstrap.js需要jQuery-3.1.1.js。而我们先引入bootstrap.js再引入jquery-3.1.1.js，导致在加载脚本的时候bootstrap相关规则找不到jquery中需要的内容，所以报红。
将引入的文件修改一下顺序，让jquery脚本先于bootstrap脚本导入，代码如下：
<script type="text/javascript" src="../libs/jquery-3.1.1.js"></script> <script type="text/javascript" src="../libs/bootstrap-3.3.7/js/bootstrap.js"></script>
即可解决下拉菜单不弹出的bug。效果如下：
bootstrap.js插件是基于jquery.js实现的，而我们的head之间的代码是从上往下解析执行加载的，所以要先引入jquery.js文件，方可使用bootrap.js，在以后的使用中我们需要特别注意他们的引入顺序。
以上所述是小编给大家介绍的BootStrap 下拉菜单点击之后不会出现下拉菜单(下拉菜单不弹出)的解决方案，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对小牛知识库网站的支持！
-
弹出菜单是可触发的、上下文叠加显示链接列表和别的内容。它们可以与Bootstrap内置的弹出菜单JavaScript插件交互。它通过点击触发，而不是通过鼠标悬停悬浮。这是一个故意设计决策。 示例 把弹出菜单的触发器以及弹出菜单包裹在一个.dropdown中，或者其它声明了position:relative;的元素中。然后，添加菜单的HTML。 <div class="dropdown open">
-
主要内容：用法,实例,实例,选项,方法,实例Bootstrap 下拉菜单 这一章讲解了下拉菜单，但是没有涉及到交互部分，本章将具体讲解下拉菜单的交互。使用下拉菜单（Dropdown）插件，您可以向任何组件（比如导航栏、标签页、胶囊式导航菜单、按钮等）添加下拉菜单。 如果您想要单独引用该插件的功能，那么您需要引用 dropdown.js。或者，正如 Bootstrap 插件概览 一章中所提到，您可以引用 bootstrap.js 或压缩版的
-
主要内容：实例,选项,实例,实例,更多实例本章将重点介绍 Bootstrap 下拉菜单。下拉菜单是可切换的，是以列表格式显示链接的上下文菜单。这可以通过与 下拉菜单（Dropdown） JavaScript 插件 的互动来实现。 如需使用下拉菜单，只需要在 class .dropdown 内加上下拉菜单即可。下面的实例演示了基本的下拉菜单： 实例 <div class="dropdown"> <button type="button" c
-
问题内容： 我有以下形式的数据 我想要两个下拉菜单。第一个下拉列表将显示“名称”。当用户从第一个下拉列表中选择名称时，应在第二个下拉列表中填充相应的“版本”。 无效的jsfiddle链接：http：//jsfiddle.net/fynVy/174/ 问题答案： 您需要调整HTML模板，以便第一个下拉列表显示服务器名称，并且第二个下拉列表的选项基于所选下拉列表（第一个下拉列表的ngModel）中的版
-
本文向大家介绍Bootstrap下拉菜单样式，包括了Bootstrap下拉菜单样式的使用技巧和注意事项，需要的朋友参考一下 本文实例为大家分享了Bootstrap下拉菜单的具体代码，供大家参考，具体内容如下 效果图： Bootstrap下拉菜单的样式： 效果图： 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持呐喊教程。
-
主要内容：实例,分割的按钮下拉菜单,实例,按钮下拉菜单的大小,实例,按钮上拉菜单,实例本章将讲解如何使用 Bootstrap class 向按钮添加下拉菜单。如需向按钮添加下拉菜单，只需要简单地在一个 .btn-group 容器中放置按钮和下拉菜单即可。您也可以使用 <span class="caret"></span> 来指示按钮作为下拉菜单。 下面的实例演示了一个基本的简单的按钮下拉菜单： 实例 <div class="btn-group"> <button type="but