javascript - 复选框依赖 JavaScript

Question

已结束。此问题正在寻求书籍、工具、软件库等的推荐。不满足 Stack Overflow guidelines 。目前不接受答案。

---

我们不允许提出寻求书籍、工具、软件库等推荐的问题。您可以编辑问题，以便用事实和引文来回答。

已关闭 4 年前。

Improve this question

我的工作是实现一个目录。它由大约 100 个复选框组成。这些是相互依赖的。例如:如果选择了 ID=4 的复选框，则必须禁用 ID=56 和 ID=27 的复选框。

是否存在框架或类似的东西来实现这一点？

谢谢!

Answer 1

我不知道是否已经有任何 js 模块可以实现此目的，但您可以通过创建映射并禁用复选框来尝试以下方法。

var checkboxMap = {
  "4": [56, 27]
}

function disableCheckboxes(id) {
  for (i in checkboxMap[id]) {
    document.getElementById(checkboxMap[id][i]).disabled = true;
  }
}

var checkboxes = document.getElementsByClassName("checkbox")

//adding event listener

for (var i = 0; i < checkboxes.length; i++) {
  checkboxes[i].addEventListener("change", function(e) {
    if (e.target.checked) {
      disableCheckboxes(e.target.id);
    }
  })
}

<label for="4">id: 4
<input type="checkbox" id="4" class="checkbox" />
</label>

<label for="56">id: 56
<input type="checkbox" id="56" class="checkbox" />
</label>

<label for="27">id: 27
<input type="checkbox" id="27" class="checkbox" />
</label>