zoukankan html css js c++ java

复选框的全选反选实现

<!doctype html>  
<html lang="en">  
    <head>  
        <meta charset="UTF-8">  
        <title>测试页面</title>  
        <script src = "jquery.js"></script>  
        <script src = "test.js"></script>  
    </head>  
    <body>  
        <input type = "checkbox" id = "allCheck"/>全选</th><br/>  
        <input type = "checkbox" name = "check"/></th>  
        <input type = "checkbox" name = "check"/></th>  
        <input type = "checkbox" name = "check"/></th>  
        <input type = "checkbox" name = "check"/></th>  
    </body>  
</html>

//全选框  
$("#allCheck").click(function(){  
    if($(this).attr("checked")){  
        $("input[name='check']").attr("checked",true);  
    }else{  
        $("input[name='check']").attr("checked",false);  
    }  
})  
//单选框  
$("input[name='check']").change(function(){  
    if($("input[name='check']").not("input:checked").size() <= 0){  
        $("#allCheck").attr("checked",true);  
    }else{  
        $("#allCheck").attr("checked",false);  
    }  
})

//全选框  
$("#allCheck").click(function(){  
    $("input[name='check']").prop("checked",this.checked);  
})  
//单选框  
$("input[name='check']").change(function(){  
    if($("input[name='check']").not("input:checked").size() <= 0){  
        $("#allCheck").prop("checked",true);  
    }else{  
        $("#allCheck").prop("checked",false);  
    }  
})

//全选框  
$("#allCheck").click(function(){  
    var a = document.getElementById("allCheck");  
    var b = document.getElementsByName("check");  
    if(a.checked){  
        for(var i = 0; i < b.length; i++){  
            b[i].checked = true;  
        }  
    }else{  
        for(var i = 0; i < b.length; i++){  
            b[i].checked = false;  
        }  
    }  
})  
//单选框  
$("input[name='check']").click(function(){  
    var flag = true;  
    var a = document.getElementById("allCheck");  
    var b = document.getElementsByName("check");  
    for(var i = 0; i < b.length; i++){  
        if(!b[i].checked){  
            flag = false;  
            break;  
        }  
    }  
    a.checked = flag;  
});

如果不行，用on代理

$(document).on('click',"input[name='subChk']",function(){

});

查看全文

相关阅读:
二进制包安装MySQL数据库
 Nginx 访问日志轮询切割
 安装Nginx服务
 生产环境常见的HTTP状态码列表
 SSH批量部署服务
 MYSQL数据库的优化
 inotify+rsync实现实时同步部署
 rsync同步架构
 Linux shell脚本编程(三)
Linux shell脚本编程(二)

原文地址：https://www.cnblogs.com/zsy0712/p/7272402.html