js实现勾选全选框，全部的选框都选中，取消一个选框，全选框就取消的效果

最新推荐文章于 2024-07-14 22:43:19 发布

陌依依

最新推荐文章于 2024-07-14 22:43:19 发布

阅读量2.8k

点赞数 1

分类专栏： web前端开发文章标签： javascript 开发语言 html 前端 web

本文链接：https://blog.csdn.net/a1598452168YY/article/details/127393337

版权

这篇博客详细介绍了如何使用JavaScript实现全选和反选功能。点击全选按钮可以选中所有子选框，而当所有子选框被手动选中时，全选按钮也会自动选中。文中提供了具体的代码示例来展示这两个功能的实现。

摘要由CSDN通过智能技术生成

要实现的功能：

● 点击全选，下面的选框就全选中了；

● 或者是不点击全选，但是将下面的选框全部选中，全选框就自动选中；

图示效果：

代码：（上面效果的代码）

<body>
    <input type="checkbox" id="all">全选/全不选
    <hr>
    <ul>
        <li>
            <input type="checkbox">商品1
        </li>
        <li>
            <input type="checkbox">商品2
        </li>
        <li>
            <input type="checkbox">商品3
        </li>
        <li>
            <input type="checkbox">商品4
        </li>
        <li>
            <input type="checkbox">商品5
        <