通过 javascript/jquery 关闭 select2 下拉菜单答案

【问题标题】：close select2 dropdown via javascript/jquery通过 javascript/jquery 关闭 select2 下拉菜单
【发布时间】：2014-03-06 01:47:42
【问题描述】：

美好的一天，如何通过 jquery 或 javascript 正确关闭 select2 下拉菜单？

现在我使用select2-dropdown.toggle() 关闭它，

但我注意到它只会隐藏列表，并且 select2 框仍然被突出显示

我想失去焦点或类似的东西，只是为了正确关闭它并能够得出这样的结果。

顺便说一下，屏幕截图很暗，因为那些 select2 框位于引导模式下，每当我按 Enter 时就会出现。

任何建议都将不胜感激！提前致谢

【问题讨论】：

【解决方案1】：

我知道这是一个老问题，但为了使用 API 执行此操作，您只需执行以下操作：

Select2 API

 $("#select2-drop-mask").select2("close");

该问题还提到了引导模式对话框，这往往是人们希望以编程方式关闭它的原因。

对于任何人的信息，这是您的操作方式：

引导程序 3

$('#myModal').on('hidden.bs.modal', function () {
  $('#select2-drop-mask').select2("close");
})

引导程序 2

$('#myModal').on('hidden', function () {
   $('#select2-drop-mask').select2("close");
})

【讨论】：

【解决方案2】：

在 v4.0 中，没有其他答案对我有用。使用 jQuery 只选择蒙版没有效果。我不得不使用选择框本身的 id：

$("#mySelectElement").select2("close")

这也有效，但可能不是首选：

$("#mySelectElement").select2().trigger("select2:close");

另外，对于 Bootstrap 3，hidden.bs.modal 事件为时已晚，并且 select2 掩码会在动画期间停留一秒钟。 hide.bs.modal 对我们来说更顺畅一些：

$('#modalYourModal').on('hide.bs.modal', function () {
    //close select2 in case its open
    $("#mySelectElement").select2("close");
});

【讨论】：

【解决方案3】：

这个对我有用$("#select2-drop-mask").click();

【讨论】：

【解决方案4】：

select2-dropdown-*mask* 不适合我，但下面的可以。

$('#select2-drop').select2('close');

【讨论】：

@stevemoretz - 有没有办法按类关闭它们？（无需使用每个 ID）
@BeninCA 可能通过使用 $('.id').each(function()){$(this).select2('close');}
@stevemoretz - 试过这样，但不行：$('.select2').each(function(){$(this).select2('close');})
转而发布了一个新问题：stackoverflow.com/questions/58347627/…
@BeninCA 这就是为什么我说这些东西可能有点连贯。尤其是在不同的版本中，您会得到不同的结果。希望新问题会得到很好的最新答案

【解决方案5】：

在 Bootstrap 版本 4 及更高版本中关闭所有。试试：

$('body').trigger('mousedown');

【讨论】：

【解决方案6】：

select2-dropdown.blur();

我认为这就是您要寻找的。 Here你刚才在JSFiddle中有一个我刚刚创建的例子。

【讨论】：

感谢@mbecares 的回答，这也是我的想法，我应该使用 blur() 函数，但它仍然无法正常工作。顺便说一句，我使用的是文本框，因为你不能在“select”上使用select2的ajax函数

【解决方案7】：

所有 select2 元素都有类 select2-hidden-accessible。所以我们可以在选择器中使用这个类并关闭它们

$('.select2.select2-hidden-accessible').select2('close');

或尝试使用 id 选择器仅关闭其中一个。

【讨论】：