Question

我想知道是否有任何方法可以使用Twitter Bootstrap的按钮下拉菜单替换表单中的选择框。对于移动设备上的用户来说，按钮下拉菜单比标准选择框更优雅，更容易，我希望能够在表单中使用它，以便在表单提交时传递按钮下拉输入。

Answer 1

有一个很好的插件用于此目的..

一个是Bootstrap Select2（http://ivaynberg.github.io/select2/）

演示：http://bootply.com/63744

另一个是bootstrap-select（https://github.com/silviomoreto/bootstrap-select）：

演示：http://bootply.com/88082

Answer 2

我最近在使用角度的项目中沿着这些线做了一些事情。结果实际上相当不错，因为预期的设备是iphone，新的ios7选择并不是很受欢迎。这个片段中有一些自定义样式，但你可以理解。

<div class="dropdown type">
  <a class="dropdown-toggle" data-toggle="dropdown" href="#">
    <span class="typeSelectionBox">{{report.type}}</span>
  </a>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
    <li><a ng-click="setType('Finance')">Finance</a></li>
    <li><a ng-click="setType('Accounting')">Accounting</a></li>
    <li><a ng-click="setType('Marketing')">Marketing</a></li>
  </ul>
</div>

然后在控制器上我只有一个方法可以在单击项目时设置类型。这避免了使用选择框组件

按钮下拉列表代替选择

2 个答案: