Question

我们连续有一个select2下拉列表（只是一个div），我们需要能够点击整行以触发下拉列表。我没有问题显示它，但试图隐藏它已成为一个问题，我想知道我的逻辑是否有缺陷。 select2 AFAIK在我们所使用的版本上没有切换方法，因此我必须手动使用它的打开和关闭方法。这就是我的尝试。

$('[data-variable-type=select]').on('click', function(e){
  e.stopPropagation();
  var _dropdown = $(this).find('div.interface_dropdown');
  if( _dropdown.hasClass('select2-dropdown-open') ) {
    $(this).find('select.interface_dropdown').select2('close');
  }
  else {
    $(this).find('select.interface_dropdown').select2('open');
  }
});

这会导致它正常打开，但当您单击以关闭它时，它会在mousedown上关闭，但会在mouseup上重新出现。

有没有我可以正确切换？

Answer 1

您会发布相关的HTML吗？如果没有看到内容，就很难理解你在做什么。

$('[data-variable-type=select]').on('click', function(e){ 
    e.stopPropagation();
    var _dropdown = $(this).find('div.interface_dropdown');
    if( _dropdown.hasClass('select2-dropdown-open') ) {
        _dropdown.removeClass('select2-dropdown-open');
        _dropdown.select2('close');
    } else {
       _dropdown.select2('open');
       _dropdown.addClass('select2-dropdown-open');
   }
});

看起来您忘了添加/删除该课程，也许这会更好用？再一次，我在没有看到你的内容的情况下在黑暗中感受到了这种感觉。

Answer 2

if( _dropdown.hasClass('select2-dropdown-open') ) {
$(this).find('select.interface_dropdown').select2('close');
}

在select2（3.3+ iirc）的更高版本中，这将永远不会被触发，因为当打开时，select2会在整个浏览器上创建一个透明遮罩并侦听单击事件。当单击当前打开的掩码时，select2将关闭。当用户准备做其他事情时，这是关闭select2的唯一可靠方法。

Answer 3

正确的方法是：

$('select').data('select2').toggleDropdown()

从不同的元素切换select2

3 个答案: