Twitter的引导下拉触发的形式提交（搜索）

<div class="btn-toolbar search-dropdown" style="float:left;margin-right:10px;"> 
    <div class="btn-group"> 
     <button class="btn btn-small">All Types</button> 
     <button data-toggle="dropdown" class="btn btn-small dropdown-toggle"><span class="caret"></span> 
     </button> 
     <ul class="dropdown-menu" id="search-type"> 
      <li> 
       <label class="checkbox"> 
        <input type="checkbox" name="tv" value="TV">TV</input></label> 
      </li> 
      <li> 
       <label class="checkbox"> 
        <input type="checkbox" name="movies" value="Movies">Movies</input></label> 
      </li> 
     </ul> 
    </div> 
</div>

来源

2013-03-05 vick

你想achieve..i认为你需要根据该 – Peeyush 2013-03-05 22:45:11

我不希望当我点击下拉搜索中触发调整你的代码是什么。：）就这样。 – vick 2013-03-05 22:49:41

好，那么你是说当你点击复选框时你不想关闭下拉菜单...是吗？ – Peeyush 2013-03-05 23:04:20

这因为<button>元素默认提交了自己的表单 - 它们继承了type="submit"属性。

如果你不想让他们这样做，添加属性type="button"，所以它会成为一个正常的按钮。

来源

2013-03-05 23:33:01 gustavohenke

你是一个天才，谢谢！ – vick 2013-03-05 23:42:14

这并不能解决我的问题。在同一个容器中，我有一个Bootstrap下拉列表和一系列按钮。选择下拉项目总是会触发下一个按钮。他们都设置为键入=“按钮”。 – 2014-07-22 21:35:29

如果你不想关闭下拉框时的复选框一些点击，那么你可以是这样做的：

jQuery(document).ready(function($){ 

    $('input[type="checkbox"]').on('click',function(event){ 
     event.stopPropagation(); 

    }); 

});

来源

2013-03-05 23:15:50 Peeyush

使用<a>元素而不是<button>作为下拉切换。唯一的缺点是如果您混合使用不同的类型，则可能会导致渲染不一致。如果你担心这一点，也可以将提交按钮切换到<a>，并使用JavaScript提交表单onclick。

来源

2013-03-05 23:34:28 landons

<div class="btn-toolbar search-dropdown" style="float:left;margin-right:10px;"> 
<div class="btn-group"> 
    <button class="btn btn-small">All Types</button> 
    <button data-toggle="dropdown" class="btn btn-small dropdown-toggle"><span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" id="search-type"> 
     <li> 
      <label class="checkbox"> 
       <input type="checkbox" name="tv" value="TV" onclick="search()">TV</input></label> 
     </li> 
     <li> 
      <label class="checkbox"> 
       <input type="checkbox" name="movies" value="Movies" onclick="search()">Movies</input></label> 
     </li> 
    </ul> 
</div>

来源

2013-03-05 23:40:33

Twitter的引导下拉触发的形式提交（搜索）

回答

相关问题