最近没事写了个特别基础的多选框功能代码,代码以下:
js部分:javascript
//获取全部class为checkbox的多选按钮(须要如下功能须要先写出对应功能的元素)。 var checkBoxList = document.getElementsByClassName("checkbox"), checkAll = document.getElementById("checkAll"),//全选 checkReverse = document.getElementById("checkReverse"),//反选 checkClear = document.getElementById("checkClear");//清空 //全选 checkAll.onclick = function(){ for(var i=0;i<checkBoxList.length;i++){ checkBoxList[i].checked=true; } } //反选 checkReverse.onclick = function(){ for(var i=0;i<checkBoxList.length;i++){ if(checkBoxList[i].checked==true){ checkBoxList[i].checked=false; }else{ checkBoxList[i].checked=true; } } } //清空 checkClear.onclick = function(){ for(var i=0;i<checkBoxList.length;i++){ checkBoxList[i].checked=false; } }
html部分:html
<input type="checkbox" class="checkbox" id="c1"> <input type="checkbox" class="checkbox" id="c2"> <input type="checkbox" class="checkbox" id="c3"> <a id="checkAll" href="javascript:void(0)">全选</a> <a id="checkReverse" href="javascript:void(0)">反选</a> <a id="checkClear" href="javascript:void(0)">清空</a>
第一次写文章,大牛随便看看,之后会陆续写一些,欢迎你们一块儿交流进步~java