如何使用具有多个 id 的 select2.js答案

【问题标题】：How to use select2.js with multiple ids如何使用具有多个 id 的 select2.js
【发布时间】：2019-08-30 07:44:12
【问题描述】：

select2-multiple 仅在放置一次时有效。但我有一个页面，我需要多次放置 select2-multiple 。

由于 select2 将特定的 id 分配给 div，即 select-multiple，我无法更改它。

工作正常->

<select id="select2-multiple" data-plugin="select2" class="form-control" multiple>

放置多个时，不起作用->（只有第一个起作用）

<select id="select2-multiple" data-plugin="select2" class="form-control" multiple>
<select id="select2-multiple" data-plugin="select2" class="form-control" multiple>
<select id="select2-multiple" data-plugin="select2" class="form-control" multiple>

我知道是因为多个 id 重叠。但我无法更改 id，因为 select2 不能在“select2-multiple”以外的其他 id 上工作

任何解决方案？

【问题讨论】：

你也可以分配name吗？每个选择元素上的不同名称。
是的，我可以分配。但仍然由于相同的 id，select2 将不起作用。只有第一个有效
i can't change the id as select2 will not work on different id other than "select2-multiple" 鉴于此，您实际上可以在自己的脚本上操作select2 plugin，因此您可以分配独特的元素。
“但我无法更改 id，因为 select2 不能在“select2-multiple”以外的其他 id 上工作” - 你在说什么……？ select2.org/getting-started/basic-usage 上的示例甚至根本不使用任何 ID。（您是否有可能误以为 $('#select2-multiple').select2() 是初始化它的唯一方法……？）
使用 class 而不是 id 正在工作......你应该尝试一下

标签： php jquery-select2

【解决方案1】：

你不能为同一个 ID 初始化两个 select2，因此使用类属性来初始化 select2。

HTML

<select class="form-control select2-multiple" multiple>
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
</select>

<select class="form-control select2-multiple" multiple>
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
</select>

$(document).ready(function() {
   $('.select2-multiple').select2();
});

工作演示：https://jsbin.com/misubazino

【讨论】：