MaterializeCss :如何在多个选择中使用JQuery启用不同的复选框？

<form>
  <p>
    <label>
      <input type="checkbox" class="filled-in" id="checkbox1" />
      <span>选项1</span>
    </label>
  </p>
  <p>
    <label>
      <input type="checkbox" class="filled-in" id="checkbox2" />
      <span>选项2</span>
    </label>
  </p>
  <p>
    <label>
      <input type="checkbox" class="filled-in" id="checkbox3" />
      <span>选项3</span>
    </label>
  </p>
</form>

$(document).ready(function() {
  // 监听选择的变化
  $('input[type="checkbox"]').on('change', function() {
    // 获取当前选择的复选框的ID
    var checkboxId = $(this).attr('id');
    
    // 根据不同的选择来启用或禁用相应的复选框
    if (checkboxId === 'checkbox1') {
      $('#checkbox2').prop('disabled', !$(this).prop('checked'));
      $('#checkbox3').prop('disabled', !$(this).prop('checked'));
    } else if (checkboxId === 'checkbox2') {
      $('#checkbox1').prop('disabled', !$(this).prop('checked'));
      $('#checkbox3').prop('disabled', !$(this).prop('checked'));
    } else if (checkboxId === 'checkbox3') {
      $('#checkbox1').prop('disabled', !$(this).prop('checked'));
      $('#checkbox2').prop('disabled', !$(this).prop('checked'));
    }
  });
});