javascript - 从不同元素切换 select2

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');
  }
});

这会导致它正确打开，但是当您单击关闭它时，它会在鼠标按下时关闭，但在鼠标松开时重新出现。

有什么办法可以让它正确切换吗？

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');
   }
});

看起来您忘记添加/删除该类，也许这会更好？再说一次，我在看不到你的内容的情况下感觉周围一片黑暗。