拆分按钮的按钮部分的用途答案

【问题标题】：Purpose of button part of a split button拆分按钮的按钮部分的用途
【发布时间】：2014-09-24 16:07:00
【问题描述】：

拆分按钮的按钮部分的作用是什么？

我正在使用最新版本的 Bootstrap 3。我有一个详细信息拆分按钮，当您单击箭头时会显示几个选项。单击后，它将带用户进入该页面。如果我点击按钮部分而不是箭头，应该会发生什么？它应该转到默认页面吗？如果是这样，我将如何更改下面的代码才能做到这一点？我需要将按钮更改为链接吗？

<div class="btn-group">
    <button type="button" class="btn btn-default">Details</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="#">Client Information</a></li>
        <li><a href="#">Option 2</a></li>
        <li><a href="#">Option 3</a></li>
    </ul>
</div>

【问题讨论】：

“应该”发生什么取决于您。您绝对可以将其转到默认页面，该页面可能与第一个下拉项或其他内容相同。完全取决于你。 @Dan 的实现是正确的。

标签： javascript html twitter-bootstrap user-interface twitter-bootstrap-3

【解决方案1】：

是的，您可以使用此拆分按钮/下拉菜单让用户轻松访问链接，而无需打开下拉菜单。

如果您想将 Button 更改为链接，并保持样式不变，您只需将 <button> 更改为 <a> 标记即可。带有btn btn-default 类的<a> 标记的样式将类似于按钮。

<a href="#your_link" class="btn btn-default">Details</a>

Bootply Demo

【讨论】：

【解决方案2】：

按钮部分的目的是让用户快速访问默认选项。在我看来，您正在寻找的是常规下拉菜单，而不是拆分按钮。单击常规下拉按钮（任何位置）将打开要单击的下拉选项列表。下面是改编自 Bootstrap 文档的 sn-p。 Link to plunker

<!-- Single button -->
<div class="btn-group">
  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
    Action <span class="caret"></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>

【讨论】：