Question

我正在构建MVC 5网络应用并尝试创建拆分下拉按钮。我的代码适用于Fiddle：

<div class="btn-group pull-right">
     <button id="ClearRules" type="button" class="btn btn-xs btn-default" title="Clear all of the rules"><span class="glyphicon glyphicon-remove"></span> Clear</button>
     <button id="AddRule" type="button" class="btn btn-xs btn-default" title="Add a new rule"><span class="glyphicon glyphicon-plus"></span> Add</button>
     <button id="AddRules" class="btn btn-xs btn-default dropdown-toggle" title="Add several rules" data-toggle="dropdown">
         <span class="caret"></span>
         <span class="sr-only">Toggle Dropdown</span>
     </button>
     <ul class="dropdown-menu">
         <li><a href="#">5</a></li>
         <li><a href="#">10</a></li>
         <li><a href="#">15</a></li>
         <li><a href="#">20</a></li>
     </ul>
</div>

我的js和css个包包含bootstrap：

bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/bootstrap-toggle.js",
                  "~/Scripts/respond.js",
                  "~/Scripts/bootstrap-dialog.js"));

bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/site.css",
                  "~/Content/bootstrap-toggle.css",
                  "~/Content/bootstrap-dialog.css"));

我甚至从Boostrap网站复制了该示例，并将其放入我的代码中无济于事。按钮显示正确，但单击时下拉不会展开。

编辑：

这是我的脚本和样式导入，与它们在渲染的html头中的显示完全相同。正如Andrei所建议的那样，我想知道我是否会错过某些东西或者输错的顺序：

<script src="/Scripts/jquery-3.1.1.js"></script>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>
<link href="/Content/bootstrap-toggle.css" rel="stylesheet"/>
<link href="/Content/bootstrap-dialog.css" rel="stylesheet"/>
<script src="/Scripts/modernizr-2.8.3.js"></script>
<script src="/Scripts/Tether/Tether.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/bootstrap-toggle.js"></script>
<script src="/Scripts/respond.js"></script>
<script src="/Scripts/bootstrap-dialog.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>    
<script src="/Scripts/TheRandomizer.ItemListMaintenance.js"></script>

Answer 1

a）检查控制台是否有任何错误。

b）检查以下任何常见问题：

您没有加载jquery(.min).js
您没有加载bootstrap(.min).js
您未在jquery(.min).js

bootstrap(.min).js

您未在tether(.min).js之前加载bootstrap(.min).js并且您正在使用v4。

不幸的是，如果你没有能够创建一个最小的，完整的，可验证的错误示例（你说你做不到），那就是我能提供的所有帮助。祝你好运！

Answer 2

导致此问题的一个常见错误是加载jquery文件两次。我建议你在浏览器菜单中使用查看页面源和 inspect 转到源代码并搜索jquery，并确保在输出html中找不到两次jquery

Bootstrap Dropdown在本地不起作用但在Fiddle上工作

2 个答案: