如何根据另一个表单值动态显示(或不显示)复选框？

<form>
  <label for="checkbox1">选项1</label>
  <input type="checkbox" id="checkbox1" class="dynamic-checkbox">

  <label for="checkbox2">选项2</label>
  <input type="checkbox" id="checkbox2" class="dynamic-checkbox">

  <label for="dependentField">依赖字段</label>
  <select id="dependentField">
    <option value="1">选项1</option>
    <option value="2">选项2</option>
  </select>
</form>

document.getElementById("dependentField").addEventListener("change", function() {
  var selectedValue = this.value;
  var checkboxes = document.getElementsByClassName("dynamic-checkbox");

  for (var i = 0; i < checkboxes.length; i++) {
    if (selectedValue === "1") {
      checkboxes[i].style.display = "block"; // 显示复选框
    } else {
      checkboxes[i].style.display = "none"; // 隐藏复选框
    }
  }
});