·您现在的位置： 云翼网络 >> 文章中心 >> 网站建设 >> 网站建设开发 >> ASP.NET网站开发 >> javascript 全选与反选

【如有意向点此提交需求】关于我们

javascript 全选与反选

作者：佚名      ASP.NET网站开发编辑：admin      更新时间：2022-07-23

javascript 全选与反选

<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <link href="CSS/StyleSheet.css" rel="stylesheet" type="text/css" /> <script type="text/Javascript"> // --列头全选框被单击--- function ChkAllClick(sonName, cbAllId) { var arrSon = document.getElementsByName(sonName); var cbAll = document.getElementById(cbAllId); var tempState = cbAll.checked; for (i = 0; i < arrSon.length; i++) { if (arrSon[i].checked != tempState) arrSon[i].click(); } } // --子项复选框被单击--- function ChkSonClick(sonName, cbAllId) { var arrSon = document.getElementsByName(sonName); var cbAll = document.getElementById(cbAllId); for (var i = 0; i < arrSon.length; i++) { if (!arrSon[i].checked) { cbAll.checked = false; return; } } cbAll.checked = true; } // --反选被单击--- function ChkOppClick(sonName) { var arrSon = document.getElementsByName(sonName); for (i = 0; i < arrSon.length; i++) { arrSon[i].click(); } } function AddTOWISH(sonName) { var arrSon = document.getElementsByName(sonName); var wishlist = document.getElementById("wishlist"); var ps = document.getElementById("wishlist").getElementsByTagName("p"); for (var j = 1; j<ps.length; j) { var history = document.getElementById("history"); history.appendChild(ps[j]); } for (var i = 0; i < arrSon.length; i++) { if (arrSon[i].checked) { var ele = document.createElement("p"); var text = document.createTextNode(arrSon[i].value); ele.appendChild(text); wishlist.appendChild(ele); } } } </script> <style type="text/css"> #Button1 { height: 42px; width: 179px; } #Checkbox1 { height: 25px; width: 26px; } </style></head><body> <div id="content"> <div id="left"> <ul> <li><a><strong>安全类</strong></a></li> <ul> <li><a>金框类</a></li> <li><a>塑框类</a></li> </ul> <li><a>运动类</a></li> <li><a>时尚金框类</a></li> <li><a>时尚塑框类</a></li> <li><a>儿童类</a></li> <li><a>老花类</a></li> <li><a>光学射出类</a></li> <li><a>光学板材类</a></li> <li><a>光学金框类</a></li> <li><a>光学性眼镜</a></li> </ul> </div> <div id="middle"> <form runat="server"> <INPUT name="chkAll" id="chkAll" title="全选" onClick="ChkAllClick('chkSon','chkAll')" type="checkbox" />全选 <INPUT name="chkOpposite" id="chkOpposite" title="反选" onClick="ChkOppClick('chkSon')" type="checkbox" />反选 <input type="button" id="add" name="add" onclick="AddTOWISH('chkSon')" value="add"/> <br /> <%for (int i = 0; i < 10; i++) {%> <INPUT name="chkSon" id='chkSon<%=i+1 %>' type="checkbox" value='<%=i+1 %>' onclick="ChkSonClick('chkSon','chkAll')" /><%=i+1 %> <br /> <%} %> </form> </div> <div id="right"> <div id="wishlist"> <p>本次清单内容：</p> </div> <div id="history"> <p>历史清单内容：</p> </div> </div> </div> </body></html>