javascript - 使用 jQuery 禁用多个 select2 字段

Question

我创建了一个复选框字段和多个 select2 字段，并且启用了复选框字段，但该更改不会影响多个选择字段。我需要在禁用复选框后禁用多重选择字段。这可能吗？我尝试了下面的代码。

$('select option').prop("disabled", true);

Answer 1

使用 $(".sel2").prop("disabled", true) 禁用 select2有关更多详细信息，请参阅文档 https://select2.org/appearance

$(document).ready(function() {
    $('.sel2').select2();
});
$(document).on('click','#disable',function() {
  if ($(this).prop("checked")) {
  //console.log("in");
    $(".sel2").prop("disabled", true);
  }
})

<link href="https://cdn.jsdelivr.net/npm/select2@4.0.12/dist/css/select2.min.css" rel="stylesheet"/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.12/dist/js/select2.min.js"></script>
<select class="sel2" name="state">
  <option value="AL">one</option>
  <option value="AL">two</option>
</select>
<select class="sel2" name="state">
  <option value="AL">one</option>
  <option value="AL">two</option>
</select>
<select class="sel2" name="state">
  <option value="AL">one</option>
  <option value="AL">two</option>
</select>
<input type="checkbox" id="disable" value="Disable select" /> Disable

如果您想在选中和取消选中复选框时启用和禁用 select2 字段

$(document).on('click','#disable',function() {
  if ($(this).prop("checked")) {
    $(".sel2").prop("disabled", true);
  }else{
    $(".sel2").prop("disabled", false);
  }
})