您需要阻止事件在DOM树中向上冒泡：

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

event.stopPropagation防止事件到达最终由Bootstrap隐藏菜单处理的节点。

演示：http://jsfiddle.net/wkc5md23/3/

我相信这应该是一个更合适的解决方案，因为在点击事件上停止传播有时可能会在以后的开发中导致问题。您可以在这里阅读更多信息：http://css-tricks.com/dangers-stopping-event-propagation/相反，此解决方案会停止Bootstraphide（hide.bs.dropdown）事件上的传播，这会阻止传播继续进行到hidden（hidden.bs.dropdown）事件。
下面的代码是我自己编写的，使其在所有Bootstrap下拉菜单上都能工作，因为它最初是从这里开始编写的：防止引导下拉菜单在单击时关闭我个人更喜欢这种方式，因为它使用了内置的引导下拉菜单事件，可以在这里找到：https://getbootstrap.com/docs/3.4/javascript/#dropdowns-events。

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

您可以暂时停用下拉式功能。这是一个解决方法。
下拉“菜单”内带有输入字段的示例：

//for dropdown field not closing when clicking on inputfield
$(document).on('focus', 'input', function (e) {
  // this attribute can be anything except "dropdown", you can leave it blank
  $('#yourDropdownID').attr('data-toggle', 'off');
});

//for dropdown field back to normal when not on inputfield
$(document).on('focusout', 'input', function (e) {
  $('#yourDropdownID').attr('data-toggle', 'dropdown');
});

这可以用于任何可单击的项目，您可以单独定义单击哪些项目可以关闭或不关闭下拉菜单。

在单击时未关闭侧边菜单

$(function() {
  var closeble = false;
  $('body').on('click', function (e) {
    if (!$(event.target).is('a.dropdown-toggle')) {
      closeble = false;
    }
  });
  
  $('.dropdown').on({
    'click': function (event) {
      if ($(event.target).closest('.dropdown-toggle').length) {
        closeble = true;
      } else {
        closeble = false;
      }
    },
    'hide.bs.dropdown': function () {
      return closeble;
    }
  });
});