JavaScript 多选框多选与取消多选两种写法

来源：互联网发布：智慧树网络课答案2017 编辑：程序博客网时间：2024/06/05 00:11

写法一：

如以下实例：

HTML代码块：

看书：<input type="checkbox" name="checkbox" value=1><br>写字：<input type="checkbox" name="checkbox"value=2><br>打飞机：<input type="checkbox" name="checkbox"value=3><br>玩游戏：<input type="checkbox" name="checkbox"value=4><br><button onclick="checkboxed('checkbox')">全选</button><button onclick="uncheckboxed('checkbox')">取消全选</button>

js代码块：

function checkboxed(objName){var objNameList=document.getElementsByName(objName);if(null!=objNameList){alert("全选操作");for(var i=0;i<objNameList.length;i++){objNameList[i].checked="checked";}}}function uncheckboxed(objName){var objNameList=document.getElementsByName(objName);if(null!=objNameList){alert("取消全选操作");for(var i=0;i<objNameList.length;i++){objNameList[i].checked="";}}}

写法二：用按钮实现

html代码块：

看书：<input type="checkbox" name="checkbox" value=1><br>写字：<input type="checkbox" name="checkbox"value=2><br>打飞机：<input type="checkbox" name="checkbox"value=3><br>玩游戏：<input type="checkbox" name="checkbox"value=4><br><button onclick="allcheck()">全选/取消</button>

js代码块：

var checkAll = false;function allcheck(){    checkAll = !checkAll;    let inputs = document.getElementsByName('checkbox')    for(var i =0;i<inputs.length;i++){inputs[i].checked = checkAll}}

阅读全文

0 0