Jquery实现全选和取消全选的方法

最新推荐文章于 2022-05-10 09:00:00 发布

weixin_33782386

最新推荐文章于 2022-05-10 09:00:00 发布

阅读量59

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/lamp01/p/9693239.html

本文介绍了一种在前端实现全选功能与权限管理的方法，通过使用jQuery简化DOM操作，实现全选按钮控制一组复选框的选中状态，并在用户选择权限时更新全选状态。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<input type="checkbox" id="all" />全选<br />  
<input type="checkbox" name="permission" />添加权限<br />  
<input type="checkbox" name="permission" />修改权限<br />  
<input type="checkbox" name="permission" />权限列表<br />  
<script>
    $("#all").on('click',function() {
        $("input[name='permission']").prop("checked", this.checked);
    });

    $("input[name='permission']").on('click',function() {
        var $subs = $("input[name='permission']");
        $("#all").prop("checked" , $subs.length == $subs.filter(":checked").length ? true :false);
    });
</script>