防止Bootstrap下拉菜单在点击后关闭

Question

我正在尝试在Bootstrap下拉菜单中放置复选框。 我不希望下拉菜单在点击时关闭，但如果他们在网站其他地方点击，则仍希望它关闭。 我仍然希望在下拉菜单中的单击上触发其他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/

- user1978109

Answer 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行添加了缺失的分号。

- user1978109

---

谢谢，正是我所需的。 - Julez

Answer 2

我必须实现同样的事情，并编写了一个更简单的版本：

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

希望能对某些人有所帮助。顺便说一下，这些都是非常“肮脏”的技巧，Bootstrap 真的可以为此提供一个选项。

- tom