checkbox全选和取消全选，原生JS

虎纠板栗咖

于 2022-04-10 22:43:38 发布

阅读量195

点赞数

本文链接：https://blog.csdn.net/a1028697753/article/details/124087900

版权

JavaScript DOM操作复选框全选批量操作

关键词由CSDN通过智能技术生成

<!-- 全选 -->
<script type="text/javascript">
    function quanxuan(){
        var isquanxuan = document.getElementById("quanxuan");  //获取id为quanxuan的状态
        var keytextIS = document.getElementsByName("keytext"); //获取全部name为keytext的checkbox按钮状态
        if (isquanxuan.checked) { //如果它点击了那就全选
            for (var i = 1; i < keytextIS.length; i++) {
                keytextIS[i].checked = true;
            }
        }else{
            for (var i = 1; i < keytextIS.length; i++) {
                keytextIS[i].checked = false;
            }
        }
    }
</script>
<!-- 全选 -->

<input type="checkbox" id="quanxuan" style="height: 12px;" onclick="quanxuan()">

<input type="checkbox" name='keytext'>
<input type="checkbox" name='keytext'>
<input type="checkbox" name='keytext'>
<input type="checkbox" name='keytext'>
<input type="checkbox" name='keytext'>
<input type="checkbox" name='keytext'>