jQuery实现多选框的全选

jQuery下载

----------cnpm i jquery

引入jquery.js

html文件

        <form class="" report-submit="false" >
            <input type="checkbox" name="一" id="chk1"><label for="">选项一</label>
            <input type="checkbox" name="二" id="chk2"><label for="">选项二</label>
            <input type="checkbox" name="三" id="chk3"><label for="">选项三</label>
        </form>
        <input type="checkbox" name="全选" id="chk"><label for="chk">全选</label>
    </div>
_____________________________________________________
###js文件
###//点击全选，判断全选按钮checked属性，根据条件判断执行全选或全不选
```var $chk = $("#chk");
        $("#chk").click(function(){
            if($chk.prop("checked") == true){
                $("form :checkbox").prop("checked",true)
            } else {
                $("form :checkbox").prop("checked",false)
            }
        })
 ###//表单中选中的框和所有多选框长度相等，全选为真，否则为假

       ``` $("form :checkbox").click(function(){
            if($("form :checked").length == $("form :checkbox").length){
                $chk.prop("checked",true)
            } else {
                $chk.prop("checked",false)
            }
        })
    

![效果图.png](https://img.haomeiwen.com/i11391340/68462045037f480e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)