有4到5组checkbox，怎样实现点击每组的第一个checkbox就选中这一组checkbox

<html>
<head>
<title></title>
<meta content="text/html;charset=gb2312" http-equiv="Content-Type">
<script language="JavaScript">
<!--
function check(strID)
{
var i;
var chk; obj = document.getElementsByName(strID);
chk = obj[0].checked;
for (i=0; i<obj.length; i++) {
obj[i].checked = chk;
}
}
//-->
</script>
</head>
<body>
<table width="100%" border="1" cellpadding="3" cellspacing="0">
    <tr> 
        <td> <input name="chk1" type="checkbox" id="chk1" value="1" onclick="check('chk1')"> <input name="chk1" type="checkbox" id="chk1" value="2"> 
            <input name="chk1" type="checkbox" id="chk1" value="3"> <input name="chk1" type="checkbox" id="chk1" value="4"> 
            <input name="chk1" type="checkbox" id="chk1" value="5"> </td>
    </tr>
    <tr> 
        <td><input name="chk2" type="checkbox" id="chk2" value="6"> <input name="chk2" type="checkbox" id="chk2" value="7"> 
            <input name="chk2" type="checkbox" id="chk2" value="8"> <input name="chk2" type="checkbox" id="chk2" value="8"> 
            <input name="chk2" type="checkbox" id="chk2" value="10"></td>
    </tr>
</table>
</body>
</html>
=================一代过去，一代又来，地却永远长存。日头出来，日头落下，急归所出之地。
风往南刮，又往北转，不住的旋落，而且返回转行原道，江河都往海里转，海
却不满，江河从何处流，仍归何处。

解决方案 »

  1.   

    <input type=checkbox name=c1><br>
    <input type=checkbox name=c1><br>
    <input type=checkbox name=c1><br>
    <input type=checkbox name=c1><br><br><br><input type=checkbox name=c2><br>
    <input type=checkbox name=c2><br>
    <input type=checkbox name=c2><br>
    <input type=checkbox name=c2><br><br><br><input type=checkbox name=c3><br>
    <input type=checkbox name=c3><br>
    <input type=checkbox name=c3><br>
    <input type=checkbox name=c3><br><br><br><input type=checkbox name=c4><br>
    <input type=checkbox name=c4><br>
    <input type=checkbox name=c4><br>
    <input type=checkbox name=c4><br><script language="JavaScript"><!--
    function document.onclick()
    {
        var e = window.event.srcElement;
    if (e.type != "checkbox") return;
    var a = document.getElementsByName(e.name);
    if (e == a[0])
    {
        for (var i=0; i<a.length; i++)
        a[i].checked = e.checked;
    }
    }
    //--></script>
      

  2.   

    每组checkbox的名称能不能不同？
      

  3.   

    转贴：<html>
    <head>
    <title></title>
    <meta name="Generator" content="EditPlus">
    <meta name="Author" content="JnKc">
    <meta name="Keywords" content="">
    <script language="JavaScript">
    <!--
    function chk(id){
    var oEvent = document.all(id);
    var chks = oEvent.getElementsByTagName("INPUT");
    oEvent.jnkc = !oEvent.jnkc;
    if (oEvent.jnkc){
    for (i=0;i<chks.length;i++){
    chks[i].checked=true;
    }
    } else{
    for (i=0;i<chks.length;i++){
    chks[i].checked=false;
    }
    }
    }
    var inputs = '';
    for (i=0;i<100;i++){
    inputs+='<input type=checkbox name=jnkc'+i+'> ';
    }
    //-->
    </script>
    </head>
    <body>
    <form method=post action="" id="chk0">
    <button onClick="chk('chk0')">所有全选</button>
    <hr>
    <button onClick="chk('chk1')">一组全选</button>
    <table id="chk1" border=1>
    <tr>
    <td id="chk11">
    <button onClick="chk('chk11')">一（1）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk12">
    <button onClick="chk('chk12')">一（2）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk13">
    <button onClick="chk('chk13')">一（3）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk14">
    <button onClick="chk('chk14')">一（4）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    </tr>
    </table><br/>
    <hr>
    <button onClick="chk('chk2')">二组全选</button>
    <table id="chk2" border=1>
    <tr>
    <td id="chk21">
    <button onClick="chk('chk21')">二（1）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk22">
    <button onClick="chk('chk22')">二（2）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk23">
    <button onClick="chk('chk23')">二（3）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk24">
    <button onClick="chk('chk24')">二（4）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    </tr>
    </table><br/>
    <hr>
    <button onClick="chk('chk3')">三组全选</button>
    <table id="chk3" border=1>
    <tr>
    <td id="chk31">
    <button onClick="chk('chk31')">三（1）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk32">
    <button onClick="chk('chk32')">三（2）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk33">
    <button onClick="chk('chk33')">三（3）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    <td id="chk34">
    <button onClick="chk('chk34')">三（4）组全选</button>
    <script>document.write(inputs)</script>
    </td>
    </tr>
    </table>
    </form>
    </body>
    </html>
      

  4.   

    转贴： 
    <!----form.htm--->
    <!--如果你要这个层次的checkbox默认都选择，就设置check=true(看form3),以后要控制这个层次的checkbox的选择情况，只要改变check就可以，如：form1.check=false--><html>
    <head>
    <meta name="Author" content="Go_Rush([email protected])">
    <STYLE TYPE="text/css">form{behavior:url('form.htc')}</STYLE>
    </head>
    <body>
    <button onClick="form1.check=((form1.check)?false:true)">一组全选</button>
    <button onClick="form2.check=((form2.check)?false:true)">二组全选</button>
    <form id=form1>
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    </form>
    <form id=form2>
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    </form>
    <form id=form3 check=true> 
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    </form>
    </body>
    </html>
    <!----form.htc-----><PUBLIC:COMPONENT>
    <PUBLIC:ATTACH EVENT="oncontentready" ONEVENT="element.init()" />
    <PUBLIC:METHOD NAME="init" />
    <PUBLIC:PROPERTY NAME="check" />
    <SCRIPT>
    function init(){
      element.style.margin="0px";
      element.attachEvent("onpropertychange",doSelect);
      doSelect();
    }function doSelect(){
      for(var i=0;i<element.elements.length;i++){
             //如果需要，你可以在这里检测 tagName和type,确保你操作的是一个checkbox
    element.elements[i].checked=(check)?true:false;
      } 
    }
    </SCRIPT>
    </PUBLIC:COMPONENT>