Bootstrap下拉菜单：在菜单外单击时不关闭

Question

我正在使用这个脚本来控制打开/折叠菜单项：

$('.dropdown').on({
    "click": function(event) {
        if ($(event.target).closest('.dropdown-toggle').length && $(this).parents('.dropdown').length === ($(event.target).parents('.dropdown').length - 1)) {
            $(this).data('closable', true);
        } else {
            $(this).data('closable', false);
        }
    },
    "hide.bs.dropdown": function(event) {
        hide = $(this).data('closable');
        $(this).data('closable', true);
        return hide;
    }
});

但我需要创建一个条件，即如果用户在菜单外单击，则打开的项目不会关闭。

这个问题涉及 Bootstrap 特性。只是使用：

$(document).on('click', function(event)

没有完全回答我的问题。

Answer 1

试试这个来检测你是否不在菜单中。

$(document).on('click', function(event) {
  if (!$(event.target).closest('.dropdown-toggle').length) {
      return false;
  }
});