在内部单击时,不应隐藏Bootstrap Button下拉列表

时间:2015-03-09 18:51:49

标签: jquery twitter-bootstrap

我正在尝试创建一个Button下拉列表,里面有一些复选框。我遇到的一个问题是,如果我在下拉列表中单击它会隐藏。我必须再次点击按钮才能显示下拉菜单,看看我检查了什么。

我知道它的Bootstrap Button下拉菜单的默认功能但是我如何自定义它以便在我选中复选框时它不会消失。

有没有安全的jQuery方法来定制它?我不是很擅长jQuery来自己解决这个问题。任何帮助都会非常明显。

FIDDLE

HTML

<div class="btn-group drop-down-multiselect">
                            <button type="button" class="btn  btn-default dropdown-toggle" data-toggle="dropdown"> 
                              <span class="fa fa-filter"></span>
                              Filter By
                              <span class="caret"></span> 
                            </button>
                            <ul class="dropdown-menu" role="menu">
                              <li>
                                <label>
                                  <input type="checkbox">
                                  Edited Date 
                                </label>
                              </li>
                              <li>
                                <label>
                                  <input type="checkbox">
                                  Launched 
                                </label>
                              </li>
                              <li>
                                <label>
                                  <input type="checkbox">
                                  Scheduled 
                                  </label>
                              </li>
                              <li>
                                <label>
                                  <input type="checkbox">
                                  Planned 
                                </label>
                              </li>
                            </ul>
                          </div>

1 个答案:

答案 0 :(得分:2)

$('.dropdown-menu').click(function(event){
     event.stopPropagation();
 });

http://jsfiddle.net/prxv0yhq/2/