Question

我按照bootstrap中的拆分按钮教程：

<!DOCTYPE html>
<html>
<head>
   <title>Try v1.2 Bootstrap Online</title>
    <script src="//code.jquery.com/jquery.min.js"></script>
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</head>
<body>

<div class="btn-group">
   <button type="button" class="btn btn-default">Default</button>
   <button type="button" class="btn btn-default dropdown-toggle" 
      data-toggle="dropdown">
      <span class="caret"></span>
      <span class="sr-only">Toggle Dropdown</span>
   </button>
   <ul class="dropdown-menu" role="menu">
      <li><a href="#">Action</a></li>
      <li><a href="#">Another action</a></li>
      <li><a href="#">Something else here</a></li>
      <li class="divider"></li>
      <li><a href="#">Separated link</a></li>
   </ul>
</div>
<div class="btn-group">
   <button type="button" class="btn btn-primary">Primary</button>
   <button type="button" class="btn btn-primary dropdown-toggle" 
      data-toggle="dropdown">
      <span class="caret"></span>
      <span class="sr-only">Toggle Dropdown</span>
   </button>
   <ul class="dropdown-menu" role="menu">
      <li><a href="#">Action 2</a></li>
      <li><a href="#">Another action 2</a></li>
      <li><a href="#">Something else here 2</a></li>
      <li class="divider"></li>
      <li><a href="#">Separated link 2</a></li>
   </ul>
</div>

</body>
</html>

虽然它在我的应用程序中不起作用。当我检查元素时，单击按钮时按钮组没有变成btn-group打开。任何人都可以帮助我吗？我在我的应用程序中包含了引导程序。我不确定data-toggle =“dropdown”是做什么的。看来我必须在文件中包含dropdown.js，但我已经包含了bootstrap.min.js。我是否必须对依赖做一些事情？

Answer 1

首先，我不确定你遇到了什么问题。我从CDN编辑了代码到Bootstrap库。当我检查HTML时，我看到“open”类被添加到按钮组。

第二个问题 - 什么是data-toggle="dropdown"，用来告诉dropdown.js插件代码这个按钮是一个下拉列表。

第三个问题 - 虽然不清楚，但Bootstrap文档中提到的所有JavaScript插件都已经在bootstrap.js文件中。

如何在bootstrap中添加dropdown.js依赖项

1 个答案: