Question

我很难将输入字段集中在Twitter Bootstrap的下拉菜单中。我的html标记如下：

<div class="btn-group">
  <button class="btn dropdown-toggle" data-toggle="dropdown">
    Groups <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
     <li><a href="#">Friends <i class="icon-ok pull-right"></i></a></li>
     <li><a href="#">Family <i class="icon-ok pull-right"></i></a></li>
     <li><a href="#">Other</a></li>
     <li class="divider" />
     <li><input type="text" class="input-block-level" placeholder="New group" /></li>
  </ul>
</div>

我还为此创建了一个jsFiddle：http://jsfiddle.net/Yppqw/2/

请告诉我如何在聚焦输入区域时保持下拉状态

Answer 1

尝试使用'btn-group'类

为您的元素添加'下拉列'

除非您打算在此旁边放置其他按钮，否则您可以删除该btn-group类。

Answer 2

尝试一下

<div class="dropdown inputdropdown">
                  <input class="searchformss dropdown-toggle" type="text" data-toggle="dropdown" placeholder="test" />
                  <div class="dropdown-menu">
                    <a class="dropdown-item">test</a>
                    <a class="dropdown-item">Another action</a>
                    <a class="dropdown-item">Something else here</a>
                  </div>
                </div>

在Bootstrap下拉菜单中关注输入字段

2 个答案: