layui 全选和全不选

<div class="form-group" id="test">
            <label class="col-sm-2 control-label">权限范围</label>
            <div class="col-md-6 col-sm-10">
                <ul class="" style="margin-top: 10px ;border: 1px solid #ccc;padding: 10px; border-radius: 10px;">
                    <li>
                        <input type="checkbox" class="parent" name="limits[]" value="1" lay-skin="primary" title="管理页面">
                        <ul style="margin-left: 30px;margin-top: 10px">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限1">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限2">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限3">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限4">
                        </ul>
                    </li>
                </ul> 
                <ul class="" style="margin-top: 10px ;border: 1px solid #ccc;padding: 10px; border-radius: 10px;">
                    <li>
                        <input type="checkbox" class="parent" name="limits[]" value="1" lay-skin="primary" title="管理页面2">
                        <ul style="margin-left: 30px;margin-top: 10px">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限1">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限2">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限3">
                                <input type="checkbox" name="limits[]" value="1" lay-skin="primary" title="权限4">
                        </ul>
                    </li>
                </ul> 
            </div>
        </div>
layui.use(['form', 'layedit', 'laydate','jquery'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate,
            $=layui.jquery;
        form.on('checkbox()', function(data){
            var pc =  data.elem.classList
            if(data.elem.checked == true){
                if(pc == "parent"){
                    var c =$(data.elem).siblings().children("input[type='checkbox']");
                    c.each(function(index, item){
                        item.checked = true
                    });
                }else{
                    $(data.elem).parents('li').find('.parent').prop("checked",true)
                }
            }else{
                if (pc == "parent"){
                    var c =$(data.elem).siblings().children("input[type='checkbox']");
                    c.each(function(index, item){
                        item.checked = false
                    });
                }else{
                    var c = $(data.elem).siblings("div").parent().find("input[type='checkbox']");
                    var count = 0;
                    c.each(function(index, item){
                        if (item.checked === true){
                            count++;
                        }
                    });
                    if (count == 0){
                        $(data.elem).parents('li').find('.parent').prop("checked",false)
                    }
                }
            }
            form.render('checkbox');
        })
    })

要用prop才能选中或取消选中

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值