JQuery：全选按钮的实现

最新推荐文章于 2023-03-29 10:49:48 发布

原创最新推荐文章于 2023-03-29 10:49:48 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

原创，想转就转

文章标签：

#JQuery #JS #全选 #JavaScript

Javascript 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现全选功能的方法。通过点击全选按钮，可以为一组复选框设置相同的选中状态，简化了多选操作。

 <div>
            <input type="checkbox" value="" id="checkAll"/>全选
            <input type="checkbox" value="" />1
            <input type="checkbox" value="" />2
            <input type="checkbox" value="" />3
            <input type="checkbox" value="" />4
            <input type="checkbox" value="" />5
            <input type="checkbox" value="" />6
        </div>
        <script>
            //全选
            $("#checkAll").click(function () {
                var checkbox = $(this).siblings(":not(#checkAll)");
                checkbox.attr("checked", $("#checkAll").get(0).checked);
            })
        </script>

第一步先找出所有checkbox，然后修改这些checkbox的checked属性，属性值和全选按钮的checked值相同则实现了全选。