构思
通过for循环和for in循环来实现,界面效果如下
步骤
全选:
循环给所有的表单设置checked
反选:
循环内判断checked是否为true,如果为true则改为false否则改为true
获取值:
最开始用for取,但是只打印最后一个,然后就放弃直接使用for in 来取值,后面有时间再思考这个。如果有更好的方法,您可以在评论区留下。
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>表单</title> </head> <body><div id="check"><input type="checkbox" value="A">A <br><input type="checkbox" value="B">B <br><input type="checkbox" value="C">C <br><input type="checkbox" value="D">D <br><input type="checkbox" value="E">E <br></div><br><br><input type="button" onclick="checkAll();" value="全选"><input type="button" onclick="checkRev()" value="反选"><input type="button" onclick="getAll()" value="获取"> </body><script>var oCheck = document.getElementById('check');var oInput = oCheck.getElementsByTagName('input');// 全选function checkAll(){for (var i = 0; i < oInput.length; i++) {oInput[i].checked = true;}}// 反选function checkRev(){for (var i = 0; i < oInput.length; i++) {if (oInput[i].checked) {oInput[i].checked = false;}else{oInput[i].checked = true;}}}// 获取值var oRes = [];function getAll(){for(var i in oInput){if(oInput[i].checked == true){oRes.push('第' + (Number(i)+1) + '个选项,您的选择是' + oInput[i].value);}}if (oRes.length == 0) {alert('您没有选择任何值');}else{alert(oRes);oRes = [];}}</script> </html>