0

我的代码中有一个选择下拉菜单，如下所示。我想在其中保留一些预选的选项。一些预先选择的选项应该是固定的，因此用户不能更改它们。为此，我编写了以下代码：

<select id="select2-multiple" name="users" multiple="multiple" style="width: 50%">
    <option value="4">Admin</option>
    <option value="5">Manager</option>
    <option disabled="disabled" selected value="6">User</option>
    <option selected value="7">ReadOnly User</option>
    <option disabled="disabled" selected value="8">Assistant Manager</option>
</select>
<script>
    $(document).ready(function () {
        $('#select2-multiple').select2();
    });
</script>

预先选择的选项显示没有问题。但是disabled="disabled"仍然可以从列表中删除那些。如何防止删除这些选项？

4

1 回答 1

1

我找到了。我需要使用lockedselect2 的功能。所以我所要做的就是将问题中的代码更改为：

<select
  id="select2-multiple"
  name="users"
  multiple="multiple"
  style="width: 50%"
>
  <option value = "4">Admin</option>
  <option value = "5">Manager</option>
  <option locked="locked" selected value = "6">User</option>
  <option selected value = "7">ReadOnly User</option>
  <option locked="locked" selected value = "8">Assistant Manager</option>
</select>
<script>
  $(document).ready(function() {
  $('#select2-multiple').select2();
});
</script>

所以基本上使用locked而不是禁用。但是，我最初使用的是 select2 3.2 版，但这在那里不起作用。我必须升级到 3.5.4 才能使用此功能。

文档可以在这里找到：

http://select2.github.io/select2/#locked-selections

我发现这个 SOF 线程也很有帮助：

如何使用锁定选择实现 select2

于 2019-12-10T21:42:26.917 回答