Javascript：全选和反选

来源：互联网发布：java会被淘汰吗编辑：程序博客网时间：2024/06/05 10:13
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Javascript数组</title><script type="text/javascript">window.onload = function(){var select_all = document.getElementById("select_all");var deselect = document.getElementById("reselect");var items = document.getElementsByClassName("item");//全选和取消全选操作select_all.onclick = function(){if(select_all.checked==true){for (var i = 0; i < items.length; i++) {items[i].checked =true;};}else{for (var i = 0; i < items.length; i++) {items[i].checked =false;};}}//反选操作deselect.onclick = function(){for (var i = 0; i < items.length; i++) {if(items[i].checked == true){items[i].checked = false;}else{items[i].checked = true;}};}//监听全选对象，如果不是全部选中，则全选按钮不选中var flag = true ;for (var i = 0; i < items.length; i++) {items[i].onclick = function(){for (var i = 0; i < items.length; i++) {if(items[i].checked == false){flag = false;select_all.checked = false;}};}};}</script></head><body><input type="checkbox" id="select_all">全选<input type="checkbox" id="reselect">反选<br/><br/><input type="checkbox" class="item">序号1</input><input type="checkbox" class="item">序号2</input><input type="checkbox" class="item">序号3</input><input type="checkbox" class="item">序号4</input><input type="checkbox" class="item">序号5</input><input type="checkbox" class="item">序号6</input><input type="checkbox" class="item">序号7</input><input type="checkbox" class="item">序号8</input><input type="checkbox" class="item">序号9</input><input type="checkbox" class="item">序号10</input></body></html>
0 0