现在需要使用checkbox进行两个复选框列表的联动显示，假如有两个复选框列表要显示两个结果集。A复选框列表显示数组a:[{id:'1',name:'A'},
{id:'2',name:'B'},
{id:'3',name:'C'}];B复选框列表显示数组b:[{parentId:'1',childName:'a'},
{parentId:'1',childName:'b'},
{parentId:'2',childName:'c'},
{parentId:'2',childName:'d'},
{parentId:'3',childName:'e'}];注意：数组b中的parentId对应数组a中的id现在想当点击A复选框列表中的某一项时，B复选框列表会根据A复选框列表勾选的id值显示出对应parentId的记录，并默认勾选所有的记录。有什么好方法呢，本人菜鸟，最好有代码可以参考，谢谢大家！
1 回答
HUWWW
TA贡献1874条经验 获得超12个赞
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="div1">
<input type="checkbox" value="1"> A
<input type="checkbox" value="2"> B
<input type="checkbox" value="3"> C
</div>
<div id="div2">
<input type="checkbox" value="a" data-parent="1"> a
<input type="checkbox" value="b" data-parent="1"> b
<input type="checkbox" value="c" data-parent="2"> c
<input type="checkbox" value="d" data-parent="2"> d
<input type="checkbox" value="e" data-parent="3"> e
</div>
<script>
var checks1 = document.getElementById("div1").getElementsByTagName("input");
var checks2 = document.getElementById("div2").getElementsByTagName("input");
for (var i=0;i<checks1.length;i++){
checks1[i].onclick = function () {
var cValue = this.value;
var isCheck = this.checked;
for (var j=0;j<checks2.length;j++){
if (checks2[j].dataset.parent==cValue){
checks2[j].checked =isCheck;
}
}
}
}
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消