Javascript 选择器选择器菜单无法关闭

我用引导创建了一个简单的下拉菜单，并在其中放置了一个选择器菜单

当我点击选择菜单时，一切正常。但是，如果我没有从“选择”菜单中选择任何内容，并在“引导”下拉列表外单击，则该菜单将保持不变

当下拉菜单关闭时，我如何让选择菜单也关闭

请参见代码示例：

测试
测试1
测试2
测试3
改变
$（'.下拉菜单'）。在（'单击'）上，函数（事件）{
event.stopPropagation（）；
});
$（'.selectpicker'）。selectpicker({
容器：'主体'，
dropupAuto:false
});
$（'body'）。在（'click'，函数（事件）{
var target=$（event.target）；
if（target.parents（'.bootstrap select'）.length）{
event.stopPropagation（）；
$（'.bootstrap select.open'）.removeClass（'open'）；
}
});

尝试将其添加到脚本部分的底部

  $('ul > li').on('click', function() {
    $('.dropdown').dropdown('toggle');
  })

---

您可以通过停止从“下拉菜单”的子菜单传播事件，并通过单击其他任何位置关闭打开的菜单来实现这一点。希望这会有所帮助

$('.dropdown-menu').on('click', function(event) {
     event.stopPropagation();
     $('.bootstrap-select.open').removeClass('open');
     }).find('.btn-group').on('click', function(event) {
        event.stopPropagation();
  });

 $('.selectpicker').selectpicker({
    container: 'body',
    dropupAuto: false
 });

 $('body').on('click', function(event) {
    var target = $(event.target);
    if (target.parents('.bootstrap-select').length) {
        event.stopPropagation();
        $('.bootstrap-select.open').removeClass('open');
    } 
}); 

小提琴：兴趣点：

为了关闭渲染的“选择”，在单击它然后在对话框外部单击后，需要侦听对话框隐藏事件：

 $('.dropdown').on('hide.bs.dropdown', function() {

您的方法（$（'body'）。on（'click'，function（event）{…）是错误的

要关闭渲染选择，可以删除打开的类：

$('.bootstrap-select.open').removeClass('open');

有必要更改功能：

$('.dropdown-menu').on('click', function(event) {
    event.stopPropagation();
});

因为如果您单击或未单击选择器，则必须使用此函数跟踪

因此，代码片段是（您更新的JSFIDLE是：）：

//如果在selectpicker区域内的对话框中单击，则跟踪
var selectpickerIsClicked=false；
$（函数（）{
$（'.selectpicker'）。selectpicker({
容器：'主体'，
dropupAuto:false
});
$（'.下拉菜单'）。在（'单击'）上，函数（e）{
if（$（e.target）.closest（'.bootstrap select.open'）.is（':visible'）| |$（e.target）.closest（'.btn.dropdown toggle.btn default'）。is（':visible'））{
选择PickerisClicked=true；
}
});
//当对话框关闭时。。。。
$（'.dropdown'）.on（'hide.bs.dropdown'，函数（e）{
如果（选择pickerisclicked）{
e、 预防默认值（）；
selectpickerIsClicked=false；
}
});
})；

测试
测试1
测试2
测试3
改变

感谢您的帮助gaetano！好的，这解决了选择菜单保持打开的问题，但是现在当您单击返回下拉菜单时，选择菜单的selectpicker样式已丢失。有什么想法吗？再次感谢。当我从html中删除我编写的脚本并保留您编写的脚本时，您能帮助我吗javascript窗口（在JSFIDLE中）它不再工作了。这是为什么？当我在选择菜单中选择一个项目时，选择菜单也不再关闭。@Chris.P.很抱歉延迟。我更新了答案和JSFIDLE。让我知道。我测试过了，现在一切都很好。非常感谢您的耐心。工作非常好！！非常感谢，非常感谢！

$('.dropdown-menu').on('click', function(event) {
    event.stopPropagation();
});