javascript - 取消选中复选框将取消选中表格中的其他复选框

Question

我正在使用基本的 HTML table的和input此处的复选框字段。

这就是我想用 Javascript 完成的:

表格的第二列有一个复选框。第三列包含第二列的“子选项”。每行都是独立的。

如果我取消选中 <td> 中的复选框，第 2 列，我想取消选择 <td> 中的所有复选框直接向右(第 3 列中的子选项)。

我也想反其道而行之；如果您选中第一个复选框，它将选中子选项中所有未选中的复选框。

伪代码思想:

if checkbox checked:
  uncheck child input's in td `id`

或

if checkbox checked:
   uncheck <check box one `id'>
   uncheck <check box two `id'>
   uncheck <check box three `id'>
   etc

第二个选项似乎更乏味。第一个行得通吗？

Answer 1

纯 Javascript 解决方案(没有标记框架)。

Demo

var table = document.getElementById("mytable");
var checkbox;

for(var i=0; i<table.rows.length; i++){
    checkbox = table.rows[i].cells[1].getElementsByTagName("input")[0];
    checkbox.onchange = function(){
        var others = this.parentNode.parentNode.cells[2].getElementsByTagName("input");
        for(var j=0; j<others.length; j++){
            others[j].checked = this.checked;
        }
    }
}