日期:2014-05-17  浏览次数:20416 次

一个页面有多组复选框,怎样控制每组复选框被选中的状态
如题,这个问题应该不难,可是我只会一组的情况,当页面有多组复选框的时候,就不知道如何解决了。
一组的时候,我使用的是jquery来控制:

$(function() {
            $("#cbxAll").click(function() {
                $('input[type=checkbox]').attr("checked", $(this).attr("checked"));
            });
        })


没办法区分多组的情况,在网上搜索了,没有适当的简洁的,都比较乱。

麻烦各位有做过的,不吝赐教,在线等,谢谢!!!
------解决方案--------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript">
        //name 是html表单专用于区别各组 chechbox 的属性, 不要用id(必须唯一)或者其它属性
        function getValues() {
            var aV = getCheckboxValues("a");
            var bV = getCheckboxValues("b");
            var cV = getCheckboxValues("c");

            var result = "a组选中值: " + (aV=="" ? "未选中任何值" : aV) + "\n" +
                "b组选中值: " + (bV == "" ? "未选中任何值" : bV) + "\n" +
                "c组选中值: " + (cV == "" ? "未选中任何值" : cV);

            alert(result);
        }

        function getCheckboxValues(name) {
            return $(":checkbox[name="+name+"]:checked").map(function(){  
                return $(this).val(); 
            }).get().join(",");
        }

        function chkAll(obj) {
            var name = $(obj).attr("name");
            //也许你觉得我写得太复杂, 但jquery 版本众多, 可以学点东西总是好的
            //1. jquery 1.6 以上
            //$(":checkbox[name=" + name.substring(0, 1) + "]").prop("checked", $(obj).prop("checked"));
            //2. jquery 1.6 以下
            //$(":checkbox[name=" + name.substring(0, 1) + "]").at