简易版全选
fwxstar 2018-06-28 599次浏览
摘要:
<ul>
<li><input type="...
<ul> <li><input type="checkbox"/>something</li> <li><input type="checkbox"/>something</li> <li><input type="checkbox"/>something</li> <li><input type="checkbox"/>something</li> <li><input type="checkbox"/>something</li> <li><input type="checkbox"/>something</li> </ul> <p> <input type="checkbox" id="sAll"/> <span>全选</span> </p>
var aLi=document.getElementsByTagName("li"); var eAll=document.getElementById("sAll"); var aI=aLi[0].children[0]; var len=aLi.length; var len2 = 0; for(var i=0;i<aLi.length;i++){ aLi[i].children[0].onclick= function () { if(this.checked){ len2++; this.parentNode.className = "active" }else{ eAll.checked = false; len2--; this.parentNode.className = "" } if(len2 == len){ eAll.checked = true; } }; } eAll.onclick= function () { for(var i=0;i<aLi.length;i++){ if(this.checked){ aLi[i].className = "active"; aLi[i].children[0].checked = true; }else{ aLi[i].className = ''; aLi[i].children[0].checked = false } } }
- 上一篇:return 详解
- 下一篇:一个js简单版星星评分