Question

我正在尝试以引导程序形式实现下拉按钮。很遗憾，表单未提交。它看起来像是：

<form class="form-inline" method="post" action="">
    <fieldset>
        <input type="text"></input>
        <div class="btn-group" data-toggle="dropdown">
            <a class="btn dropdown-toggle pull-right" data-toggle="dropdown" href="">
                Show <span class=caret></span></a>
            <ul class="dropdown-menu">
                <li><input name="_show" class='btn' type="submit" value="Show"></input></li>
                <li><input name="_export" class='btn' type="submit" value="Export"></input></li>
            </ul>
            <button name="_export" class='btn' type="submit">Export</button>        
    </fieldset>
</form>

两个问题：

'div'容器外的提交按钮有效，两个输入都无效。为什么？
下拉按钮未正确对齐，为什么？

*编辑*

如果从ul中删除按钮，则会在单击“显示按钮”时显示一个小的空列表同名属性并不重要，因为两个按钮的作用相同，btn-group外的按钮应被删除。一旦内部正常工作

一个非常奇怪的事情是，如果我把

    <div class="btn-group" style="vertical-align: middle" data-toggle="dropdown">
  <a class="btn dropdown-toggle pull-right" data-toggle="dropdown" href="">
    Show <span class=caret></span></a>
    <ul class="dropdown-menu">
      <li><a href="/hello">Interactive</a></li>
      <li><a href="/hello2">Pic</a></li>
    </ul>
</div>

点击下拉菜单条目时没有任何反应。在firefox中的buttom，我可以看到有一个链接，但点击没有任何影响......

对齐方式：我发现，twitter bootstrap按钮组存在一个普遍问题，通过以下方式解决： style =“vertical-align：middle”

Answer 1

试试这段代码：

<div class="container row-fluid">
  <form method="post" class="form-horizontal " action="">
    <fieldset>
      <input type="text" name="tex"/>
      <button name="_export" class='btn' type="submit">Export</button>   
      <span class="dropdown">
        <a class="btn dropdown-toggle" id="dLabel" data-toggle="dropdown" data-target="#">
          <i class="icon-minus-sign"></i> Anmeld annonce
          <span class="caret"></span>
        </a>
        <ul class="dropdown-menu" >
          <li><a name="_show" href="#">Hello</a></li>
          <li><a name="_export" href="#">Boy</a></li>
        </ul>
      </span>
    </fieldset>    
  </form>
</div>

MartialE

表单中的下拉按钮

1 个答案: