jquery全选小功能

背景需求:全选,取消全选,以及所有选中后自动勾选全选,全选后取消一个时同时自动取消全选(不知道怎么描述这个功能,就这么解释吧。。。)html

html代码以下:this

<input type="checkbox" id="checkAll" name="checkAll"/>全选

<input type="checkbox" name="check" value="1"/>1
<input type="checkbox" name="check" value="2"/>2
<input type="checkbox" name="check" value="3"/>3
<input type="checkbox" name="check" value="4"/>4
<input type="checkbox" name="check" value="5"/>5

如今开始作全选和取消全选code

功能要求:如题,就是点击一次全选再点击一次取消htm

$(document).ready(function(){
    //全选与取消全选
    $("#checkAll").click(function(){
        if( $("#checkAll").attr("checked")=="checked"){
             $("input[name='check']").attr("checked",true);
        }else{
             $("input[name='check']").attr("checked",false);
        }
    });
    
})

好,如今全选作完了,那么假如我点击全选后,发现有一个是我不须要的,我又取消掉它,这时候全选按钮是否是 应该自动的取消全选?那再假如我发现这个选项其实我仍是须要的,我又给勾上了,这时全选框是否是也应该勾上(全选框应该是自动适应其他复选框的)input

功能要求:同上,如题同步

接着后面写:io

$(document).ready(function(){
    //全选与取消全选
    $("#checkAll").click(function(){
        if( $("#checkAll").attr("checked")=="checked"){
             $("input[name='check']").attr("checked",true);
        }else{
             $("input[name='check']").attr("checked",false);
        }
    });
    //同步全选功能
    $("input[name='check']").click(function(){
        var flag = true;
        $("input[name='check']").each(function(){
            if($(this).attr("checked")!="checked"){
                flag=fasle;
                return;
            }
        });
        if(flag){
            $("#checkAll").attr("checked",true);
        }else{
            $("#checkAll").attr("checked",false);
        }
    });
})

如今全选功能就完善了,各位猿友能够试试。function

代码手打,不免有错字、漏字、描述不清等现象,欢迎你们批评指导,若是以为有用,就告诉我一声,给我点鼓励。
class

相关文章
相关标签/搜索