jquery Select 2-使每个选定选项位于其自己的行中

new9mtju  于 2022-12-18  发布在  jQuery
关注(0)|答案(1)|浏览(109)

我想知道在使用多选时,select2中是否有一个选项可以使每个选中的项目显示在自己的行中。

<select id="items-select" multiple>
  <optgroup label="Items">
     <option>Alpha</option>
     <option>Bravo</option>
     ...
     <option>Zulu</option>
  </optgroup>
</select>
$('#items-select').select2();

这是默认行为

我希望每个选项都显示在自己的行中,因为一次可以选择30多个选项,这将使用户更容易检查他们是否得到了他们想要的。
我试过使用templateSelection选项,但是添加换行符或<br>标记没有任何效果。

.select2-selection__rendered {
  display: grid !important; /* by default it's inline-block */
}

我是不是漏了什么还是没有别的办法了?

9rbhqvlz

9rbhqvlz1#

您可以添加以下CSS规则:

.select2-selection--multiple .select2-selection__choice {
    display: block !important;
    width: fit-content;
}

相关问题