这个方案牛逼的地方在于取消任意一个选项 全选按钮也会自动取消选定 <form id="form1" runat="server"> <div> <input type="checkbox" name="checkC" onclick="resAll()"/>1 <input type="checkbox" name="checkC" onclick="resAll()"/>2 <input type="checkbox" name="checkC" onclick="resAll()"/>3 <input type="checkbox" name="checkC" onclick="resAll()"/>4 <input type="checkbox" name="checkC" onclick="resAll()"/>5 <input type="checkbox" name="checkC" onclick="resAll()"/>6 <input type="checkbox" name="checkC" onclick="resAll()"/>7 <input type="checkbox" name="all" id="all" onclick="checkAll()"/>全选 <script type="text/javascript" > function checkAll(){ var d = document, items=d.getElementsByName("checkC"), itemall = d.getElementById("all"), len = items.length; for(var i=0;i<len;i++){ items[i].checked=itemall.checked; } } function resAll(){ var d = document, items=d.getElementsByName("checkC"), itemall = d.getElementById("all"), ite=0; for(var i=0;i<items.length;i++){ if(items[i].checked){ ite++; } } if(ite==items.length-1&&itemall.checked){ itemall.checked=false; } if(ite==items.length&&!itemall.checked){ itemall.checked=true; } } </script> </div> </form>
另附:
html的name和id可以类比身份证的姓名和身份证编号编号id具有唯一性,一个id只出现一次。名称name具备可重复性,可以多次出现。在css中两者都具备识别html元素的作用,name用点号.表示,id用井号#一般name用于通用多次出现元素的样式定义,id用于唯一性元素样式定义。 在表单当中,由于有些控件具备多元素特性,例如radio checkbox等,使用id不便于表单数据的提交,此外浏览器会根据name来设定发送到服务器的request,因此在表单当中,用name来提交数据。 当然,在实际的html中,也完全可以不用id,用单独的class也可以起到代替id的作用。但是在js中,是无法通过class直接后去html元素的, 定义id便于相关操作。
时间: 2024-10-23 19:00:20