select2 - 为输入和下拉设置不同的宽度

6 回答

• 2

  我用过它并且它完美无缺，只会影响到所有 select2

  #select2-drop{
      width: 400px !important;
  }
  

  回复于 2024-04-29T02:50:03+08:00
• 57

  您使用的属性不是用于控制下拉宽度 . 您可以使用 dropdownCssClass 属性 .

  Here's a demo in jsFiddle .

  JavaScript ：

  $(document).ready(function() { 
      $("#e1").select2({dropdownCssClass : 'bigdrop'}); 
  });
  

  CSS ：

  .bigdrop {
      width: 600px !important;
  }
  

  回复于 2024-04-29T02:50:03+08:00
• 71

  Select2包含'dropdownAutoWidth'参数，该参数使用javascript尝试足够宽的下拉内容 .

  $('#whatever').select2({dropdownAutoWidth : true});
  

  这至少适用于Select2 3.4.3 - 我不知道它早些引入了多少 .

  回复于 2024-04-29T02:50:03+08:00
• 1

  更好的解决方案 . 使用：

  $('#e1').select2({width: 'resolve'});
  

  回复于 2024-04-29T02:50:03+08:00
• 1

  $("#e1").select2({ width: '100%' });
  

  试试这个 . 这会将容器的宽度设置为100％

  回复于 2024-04-29T02:50:03+08:00
• 9

  以下是如何在打开时使select2更宽：

  如果您希望它向右侧扩展，请添加此css：

  .select2-container.select2-dropdown-open {
      width: 170%;
    }
  

  如果你想让它向左扩展，添加这个{

  .select2-container.select2-dropdown-open {
      width: 170%;
      margin-left: -70%;
    }
  

  回复于 2024-04-29T02:50:03+08:00