六个单选，每个单选后有三个复选框，选择其中一个单选后只能选对应的三个复选，其它的复选不让选

六个单选，每个单选后有三个复选框，选择其中一个单选后只能选对应的三个复选，其它的复选不让选，并且如果其它的单选按钮还让选，并且如果重新选择了其它的单选，则能选择的复选框也相应的改变。

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

可以用checkbox的disabled属性实现
用JS限制一下，name相同的checkbox是一组
然后选中一组的中一个以后，其他的都改成disable就可以了
一个简单的
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <SCRIPT LANGUAGE="JavaScript">
function test(){
var c0=document.getElementsByName('c0');
var c1=document.getElementsByName('c1');
var one=document.getElementsByName('one');
if(one[0].checked){
for(i=c0.length;i>0;i--) {c1[i-1].checked=false;c0[i-1].checked=true;}
}
if(one[1].checked){
for(i=c1.length;i>0;i--) {c0[i-1].checked=false;c1[i-1].checked=true;}
}
}  </SCRIPT>
</HEAD> <BODY>
<INPUT TYPE="radio" NAME="one" onclick=test() /><INPUT TYPE="checkbox" NAME="c0"><INPUT TYPE="checkbox" NAME="c0"><INPUT TYPE="checkbox" NAME="c0"><br>
<INPUT TYPE="radio" NAME="one" onclick=test() /><INPUT TYPE="checkbox" NAME="c1"><INPUT TYPE="checkbox" NAME="c1"><INPUT TYPE="checkbox" NAME="c1"><br>
</BODY>
</HTML>
不好意思，上面的不合楼主要求剩下的用disable吧
我给你个,我这个是用循环遍历的，在给复选框命名是要小心点
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <SCRIPT LANGUAGE="JavaScript">
function check(){
var radio=document.getElementsByName('radio');
for(flag=0;flag<radio.length;flag++)
{
if(radio[flag].checked){
var res = "chk"+flag;
var checkbox = document.getElementsByName(res);
for(i=0;i<checkbox.length;i++)
{
checkbox[i].checked=true;
checkbox[i].disabled =false;
}
}
else
{
var res = "chk"+flag;
var checkbox = document.getElementsByName(res);
for(i=0;i<checkbox.length;i++)
{
checkbox[i].checked=false;
checkbox[i].disabled =true;
}
}
}
}  </SCRIPT>
</HEAD> <BODY>
<INPUT type="radio" name="radio" onclick=check() />

<INPUT type="checkbox" name="chk0">
<INPUT type="checkbox" name="chk0">
<INPUT type="checkbox" name="chk0">
<br>
<INPUT type="radio" name="radio" onclick=check() />
<INPUT type="checkbox" name="chk1">
<INPUT type="checkbox" name="chk1">
<INPUT type="checkbox" name="chk1">
<br>
<INPUT type="radio" name="radio" onclick=check() />
<INPUT type="checkbox" name="chk2">
<INPUT type="checkbox" name="chk2">
<INPUT type="checkbox" name="chk2">
<br>
<INPUT type="radio" name="radio" onclick=check() />
<INPUT type="checkbox" name="chk3">
<INPUT type="checkbox" name="chk3">
<INPUT type="checkbox" name="chk3">
<br>
<INPUT type="radio" name="radio" onclick=check() />
<INPUT type="checkbox" name="chk4">
<INPUT type="checkbox" name="chk4">
<INPUT type="checkbox" name="chk4">
<br>
<INPUT type="radio" name="radio" onclick=check() />
<INPUT type="checkbox" name="chk5">
<INPUT type="checkbox" name="chk5">
<INPUT type="checkbox" name="chk5">
<br>
</BODY>
</HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <SCRIPT LANGUAGE="JavaScript">

  var n=-1;
function test(){
var radio=document.getElementsByName('one');
for(var i=0;i<radio.length;i++){
if(radio[i].checked){
var checkbox=document.getElementsByName('c'+i);
for(var j=0;j<checkbox.length;j++){
checkbox[j].disabled=false;
}
if(n!=-1){
checkbox=document.getElementsByName('c'+n);
for(var j=0;j<checkbox.length;j++){
checkbox[j].disabled=true;
}
}
n=i;
break;
}
}

}  </SCRIPT>
</HEAD> <BODY>

   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c0" disabled>
   <INPUT TYPE="checkbox" NAME="c0" disabled>
   <INPUT TYPE="checkbox" NAME="c0" disabled>
   <br>
   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c1" disabled>
   <INPUT TYPE="checkbox" NAME="c1" disabled>
   <INPUT TYPE="checkbox" NAME="c1" disabled>
   <br>
   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c2" disabled>
   <INPUT TYPE="checkbox" NAME="c2" disabled>
   <INPUT TYPE="checkbox" NAME="c2" disabled>
   <br>
   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c3" disabled>
   <INPUT TYPE="checkbox" NAME="c3" disabled>
   <INPUT TYPE="checkbox" NAME="c3" disabled>
   <br>
   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c4" disabled>
   <INPUT TYPE="checkbox" NAME="c4" disabled>
   <INPUT TYPE="checkbox" NAME="c4" disabled>
   <br>
   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c5" disabled>
   <INPUT TYPE="checkbox" NAME="c5" disabled>
   <INPUT TYPE="checkbox" NAME="c5" disabled>
   <br>
   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c6" disabled>
   <INPUT TYPE="checkbox" NAME="c6" disabled>
   <INPUT TYPE="checkbox" NAME="c6" disabled>
   <br>
   <INPUT TYPE="radio" NAME="one" onclick=test() />
   <INPUT TYPE="checkbox" NAME="c7" disabled>
   <INPUT TYPE="checkbox" NAME="c7" disabled>
   <INPUT TYPE="checkbox" NAME="c7" disabled>
   <br>

</BODY>
</HTML>