<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<BODY>
<form>
<table border=1>
<tr>
<td><input type="checkbox" value="1" name="cbox" onClick="show_input(this)" /></td>
<td>未婚</td>
</tr>
<tr>
<td><input type="checkbox" value="2" name="cbox" onClick="show_input(this)" /></td>
<td> 已婚 无小孩</td>
</tr>
<tr>
<td><input type="checkbox" value="3" name="cbox" onClick="show_input(this)" /></td>
<td>已婚 有小孩</td>
</tr>
<tr>
<td><input type="checkbox" value="4" name="cbox" onClick="show_input(this)" /></td>
<td>离婚</td>
</tr>
<tr>
<td><input type="checkbox" value="5"name="cbox" onClick="show_input(this)" /></td>
<td>其他</td>
</tr>
</table>
<table border=1>
<tr id="d1">
<td>单身生活（就自己一个人</td>
</tr>
<tr id="d2">
<td>和配偶（妻/夫</td>
</tr>
<tr id="d3">
<td>儿子/子女</td>
</tr>
<tr id="d4">
<td>父母</td>
</tr>
<tr id="d5">
<td>兄弟</td>
</tr>
<tr id="d6">
<td>祖父母</td>
</tr>
<tr id="d7">
<td>亲戚</td>
</tr>
<tr id="d8">
<td>朋友</td>
</tr>
<tr id="d9">
<td>其他</td>
</tr>
</table>
</form>
<script>
function show_input(cb)
{
//先取得同name的chekcBox的集合物件
var obj = document.getElementsByName("cbox");
for (i=0; i<obj.length; i++){
//判斷obj集合中的i元素是否為cb，若否則表示未被點選
if (obj[i]!=cb) obj[i].checked = false;
//若是 但原先未被勾選 則變成勾選；反之 則變為未勾選
//else obj[i].checked = cb.checked;
//若要至少勾選一個的話，則把上面那行else拿掉，換用下面那行
else obj[i].checked = true;
}
if(cb.checked==true)
{
var s=cb.value;
if(s=="1" || s=="4")
{
document.getElementById("d2").style.display="none";
}
else if(s=="2")
{
document.getElementById("d3").style.display="none";
}
else
{
document.getElementById("d2").style.display="block";
document.getElementById("d3").style.display="block";
}
}
}
</script>
</BODY>
</HTML>
