说实话,挺喜欢写这样的小项目的,这种东西能够有利于新人的很好成长,自己喜欢,就留笔一个吧。
其实这几个人对于新人而言,最重要的就是从外面定的信号量,可以说这种东西我感觉不管在小项目还是大项目,都能衍生出很大的想法。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>信号量的重要性</title> </head> <body> <div id="inpputBox"> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> </div> <button type="button" id="inputBtn">全选</button> <script type="text/javascript"> var btn=document.getElementById("inputBtn"); var inputBox=document.getElementById("inpputBox"); var inputList=inputBox.getElementsByTagName("input"); // 第一阶段 var idx=0; btn.onclick=function(){ if (idx==0) { for (var i=0;i<inputList.length;i++) { inputList[i].checked="checked"; } btn.innerHTML="全不选"; idx=1; } else{ for (var i=0;i<inputList.length;i++) { inputList[i].checked=""; } btn.innerHTML="全选"; idx=0; } } // 第二阶段 var idx=0; btn.onclick=function(){ idx=idx== 0 ? 1 : 0 ; var state=idx== 0 ? "" : "checked" ; var thisValue=idx== 0 ? "全选" : "全不选" ; for (var i=0;i<inputList.length;i++) { inputList[i].checked=state; btn.innerHTML=thisValue; } } // 第三阶段 var idx=false; btn.onclick=function(){ idx=!idx; var thisValue=idx== 0 ? "全选" : "全不选" ; for (var i=0;i<inputList.length;i++) { inputList[i].checked=idx; btn.innerHTML=thisValue; } } </script> </body> </html>