jquery实现复选框全选与取消全选

最新推荐文章于 2024-04-25 11:38:14 发布

hanchaojunjava

最新推荐文章于 2024-04-25 11:38:14 发布

阅读量279

点赞数

分类专栏： js 文章标签： jquery复选框操作

本文链接：https://blog.csdn.net/hanchaojunjava/article/details/82016791

版权

js 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<script type="text/javascript">
    $(function() {  
        $("#checkAll").on('click',function() {  
                $("input[name='ids']").prop("checked", this.checked);  
            });  

            $("input[name='ids']").on('click',function() {  
                  var $ids = $("input[name='ids']");  
                  $("#checkAll").prop("checked" , $ids.length == $ids.filter(":checked").length ? true :false);  
            });
    });  

function getCheckedCount(checkboxName) {
    var o = document.getElementsByName(checkboxName);
    var c = 0;
    for (var i = 0; i < o.length; i++) {
        if (o[i].checked == true) {
            c++;
        }
    }
    return c;
}
function getCheckedIds(checkboxName) {
    var o = document.getElementsByName(checkboxName);
    var ids = '';
    for (var i = 0; i < o.length; i++) {
        if (o[i].checked == true) {
            ids += o[i].value + ',';
        }
    }
    if ('' != ids) {
        ids = ids.substring(0, ids.length - 1);
    }
    return ids;
}

</script>
........
........
<tr>
    <th width="30">
        <!-- checkbox -->
        <div>
            <input type="checkbox" id="checkAll" name="checkAll">
        </div>
    </th>
</tr>
<!--for start-->
<tr>
    <td>
        <!-- checkbox -->
        <div class="i-checks">
            <input type="checkbox" name="ids" value="${list.oid}>
        </div>
    </td>
</tr>
<!--for end-->