防止引导下拉菜单在点击时关闭答案

【问题标题】：Preventing bootstrap dropdown from closing on click防止引导下拉菜单在点击时关闭
【发布时间】：2014-04-28 04:06:29
【问题描述】：

我正在尝试将复选框放在引导下拉菜单中。我不希望下拉菜单在点击时关闭，但如果他们点击网站上的其他位置，我仍然希望它关闭。我仍然想在下拉菜单中点击其他 javascript 操作。我有一个与我想要的完全相反的例子。此示例在单击时关闭下拉菜单，但在从下拉区域外部单击时保持打开状态。

 $(function () {
     $('.dropdown.keep-open').on({
         "shown.bs.dropdown": function() {
             $(this).data('closable', false);
         },
         "click": function() {
             $(this).data('closable', true);
         },
         "hide.bs.dropdown": function() {
             return $(this).data('closable');
         }
     });
 });

http://jsfiddle.net/KyleMit/ZS4L7/

【问题讨论】：

标签： twitter-bootstrap drop-down-menu

【解决方案1】：

我终于明白了。代码如下：

$(function() {
    $('.dropdown.keep-open').on({
        "shown.bs.dropdown": function() {
            $(this).data('closable', false);
        },
        "click": function(event) {
            $(this).data('closable', false);
        },
        "hide.bs.dropdown": function(event) {
            temp = $(this).data('closable');
            $(this).data('closable', true);
            return temp;
        }
    });
});

编辑：在第 11 行添加了缺少的分号。

【讨论】：

谢谢我所需要的。

【解决方案2】：

我必须实现同样的目标，并写了一个更简单的：

$('.dropdown.keep-open').one({
  'mouseenter': () => { $(this).data('closable', false); },
  'mouseleave': () => { $(this).data('closable', true); },
  'hide.bs.dropdown': () => !!$(this).data('closable')
});

我希望它对某人有所帮助。顺便说一句，这些都是非常肮脏的黑客，Bootstrap 真的可以选择。

【讨论】：