jquery检查用一个按钮取消选中所有复选框 | jquery检查用一个按钮取消选中所有复选框

本文介绍了jquery检查用一个按钮取消选中所有复选框的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想使用jquery检查/取消选中所有复选框。现在通过检查/取消选中父复选框所有的子复选框都被选中/取消选中，同时父复选框的文本更改为checkall / uncheckall。

I am trying to check/uncheck all checkboxes using jquery. Now by checking/unchecking the parent checkbox all the child checkboxes are getting selected/deselected also with the text of parent checkbox getting changed to checkall/uncheckall.

现在我想用一个输入按钮替换parent复选框，并改变按钮上的文本checkall / uncheckall。这个代码，任何人都可以调整代码....

Now i want to replace parent checkbox with a input button, and change the text also on the button to checkall/uncheckall. This the code, can anyone please tweak the code....

    $( function() {
        $( '.checkAll' ).live( 'change', function() {
            $( '.cb-element' ).attr( 'checked', $( this ).is( ':checked' ) ? 'checked' : '' );
            $( this ).next().text( $( this ).is( ':checked' ) ? 'Uncheck All' : 'Check All' );
        });
        $( '.cb-element' ).live( 'change', function() {
            $( '.cb-element' ).length == $( '.cb-element:checked' ).length ? $( '.checkAll' ).attr( 'checked', 'checked' ).next().text( 'Uncheck All' ) : $( '.checkAll' ).attr( 'checked', '' ).next().text( 'Check All' );

        });
    });


   <input type="checkbox" class="checkAll" /> <b>Check All</b>

   <input type="checkbox" class="cb-element" /> Checkbox  1
   <input type="checkbox" class="cb-element" /> Checkbox  2
   <input type="checkbox" class="cb-element" /> Checkbox  3

推荐答案

尝试以下方法：

$(document).ready(function(){
    $('.check:button').toggle(function(){
        $('input:checkbox').attr('checked','checked');
        $(this).val('uncheck all');
    },function(){
        $('input:checkbox').removeAttr('checked');
        $(this).val('check all');
    })
})

这篇关于jquery检查用一个按钮取消选中所有复选框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！