JS练习：表格全选与全不选

最新推荐文章于 2021-02-03 16:52:29 发布

weixin_34390996

最新推荐文章于 2021-02-03 16:52:29 发布

阅读量64

点赞数

原文链接：http://www.cnblogs.com/believepd/p/10012592.html

版权

代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>全选与全不选</title>
    <script>
        function checkAll() {
            //获得当前第一个checkbox的状态
            var check_1 = document.getElementById("check_1");
            //得到当前checked状态
            var checked = check_1.checked;
            //获得所有分类项的checkbox
            var checks = document.getElementsByName("checkone");
            for (var i = 0; i < checks.length; i++) {
                //修改每一个checkbox的状态
                var checkone = checks[i];
                checkone.checked = checked;
            }
        }
    </script>
</head>
<body onload="init()">
<table border="1px" id="tab">
    <thead>
    <tr>
        <th>
            <input type="checkbox" onclick="checkAll()" id="check_1"/>
        </th>
        <th>全选与全不选</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>
            <input type="checkbox" name="checkone"/>
        </td>

    </tr>
    <tr>
        <td>
            <input type="checkbox" name="checkone"/>
        </td>

    </tr>
    <tr>
        <td>
            <input type="checkbox" name="checkone"/>
        </td>

    </tr>
    </tbody>
</table>
</body>
</html>

View Code

转载于:https://www.cnblogs.com/believepd/p/10012592.html

weixin_34390996

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS练习：表格全选与全不选

代码：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>全选与全不选</title> <script> function checkAll() { //获得...
复制链接

扫一扫