Javascript Twitter引导下拉菜单——奇怪的点击行为

当用户单击按钮时，我显示一个引导下拉列表。菜单中有一些可单击的元素。我捕捉下拉列表中的所有点击并取消冒泡以保持下拉列表打开，然后在完成后手动关闭。这一切都有效

我遇到的问题是，当用户单击下拉列表中的任何元素时，导致下拉列表显示的原始按钮看起来像是被单击了。有没有办法关掉这个

屏幕截图和代码如下

jQuery以保持菜单打开

$(".page-header").on("click", ".cr-dropdown-labels", function() { return false; });
$('.cr-dropdown-labels').on("click", "span.state", function() { 
       labelMenuCheckMulti.call(this); return false; 
});

标记

<span class="btn dropdown">
    <div data-toggle="dropdown" class="dropdown-toggle" rel="tooltip" title="Label selected contacts">
        <i class="icon-tag"></i> <b class="caret"></b>
    </div>
    <ul class="dropdown-menu cr-dropdown-labels">
        <li>
            <input type="text" placeholder="Find a label" />
        </li>
        <li class="scrollable">
            <ul class="unstyled labels" data-bind="foreach: allLabels">
                <li><span class="off state"></span> <a style="display: inline;" data-bind="text: name().truncate(30)"></a></li>
            </ul>
        </li>
        <li>
            <a class="apply-label-selections">Apply</a>
        </li>
    </ul>
</span>

申请

您是否尝试将

.btn

类应用于

.dropdown toggle

而不是整个

容器？我想您不需要将菜单放在

.btn

中

对于将来的参考：单击菜单会触发整个层次结构上的

：active

伪状态，从而启用下拉列表顶部

.btn

类上的活动样式

将

.btn

类的代码示例放在正确的位置

---

此外，您不应该在

中嵌套

元素：。喜欢使用

display:inline块
最有可能需要查看jQuery/JS。@Andrew-没有jQuery-单击切换按钮时，bootstrap会自动显示下拉列表。当你在下拉列表中单击时，阻止下拉列表关闭的代码是一个简单的返回false，但是我会发布它哦，对不起，我没有太多地使用引导，所以我只是假设…我唯一能想到的是有一些类似的选择器，或者有一些重叠。这种行为相当奇怪……您是否尝试将
.btn
类应用于
.dropdown toggle
而不是整个
容器？我想您不需要将菜单放在
.btn
中。