根据Radio的选择不同，在显示区域显示不同的内容

- 中国WEB开发者网络 (http://www.webasp.net)
-- 网页特效 (http://www.webasp.net/javascript/)
--- 根据Radio的选择不同，在显示区域显示不同的内容 (http://www.webasp.net/javascript/1/760.htm)
-- 发布日期： 2005-07-06
<!-- 网页特效代码由[中国WEB开发者网络:http://www.ChinaWebDev.com]提供！ -->
<!-- 要实现此效果需要 1 个步骤： -->

<!-- 第 1 步： -->
<!-- 把下面的代码加到<BODY></BODY>区域中： -->

<script language=JavaScript>
var defaultValue = ""
function Changes() {
var defaultValue = "changed";
}
ie = document.all?1:0
ns4 = document.layers?1:0
var c = 1
function hideIt(id) {
if (ie) {
document.all[id].style.zIndex = c--;
document.all[id].style.visibility = "hidden";
document.all['hider'].style.visibility = "visible";
}
else if (ns4) {
document.layers[cat].layers[id].zIndex = c--;
document.layers[cat].layers[id].visibility = "hide";
document.layers[cat].layers['hider'].visibility = "show";
}
}
function showIt(id) {
if (ie) {
document.all[id].style.zIndex = c++;
document.all[id].style.visibility = "visible";
}
else if (ns4) {
document.layers[cat].layers[id].zIndex = c++;
document.layers[cat].layers[id].visibility = "show";
}
else {
document.getElementById(id).style.zIndex = c++;
document.getElementById(id).style.visibility = "visible";
}
}
function imgLbl(tab) {
premier = frmWc.elements[tab - 1];
if (premier.checked == 1) {
premier.checked = 0;
} else {
premier.checked = 1;
}
}
</script>
<FORM name=protectForm action=ok.asp method=post >
<TABLE width=560>

<TR>
<TD>
<TABLE cellPadding=2>

<TR align=left>
<TD vAlign=top align=left>
<INPUT
onclick="showIt( 'off');return true" type=radio value=0
name=Level checked>
说明一</TD>
<TD align=left width=20> </TD>
<TD vAlign=top align=left><INPUT
onclick="showIt( 'low');return true" type=radio
value=25 name=Level>
说明二</TD>
<TD align=left width=20> </TD>
<TD vAlign=top align=left>
<INPUT
onclick="showIt( 'high');return true" type=radio value=75 name=Level>
说明三</TD>
<TD align=left width=20> </TD>
<TD vAlign=top align=left><INPUT
onclick="showIt( 'excl');return true" type=radio
value=100 name=Level>
说明四</TD>
</TR></TABLE></TD></TR></TABLE>

<table cellspacing=1 cellpadding=0 width=562 border="0" bgcolor="7285CF" height="240">

<tr>
<td colspan=3 height="145" valign="top" bgcolor="F2F2F2">
<div id=off style="WIDTH: 560px;POSITION: absolute; HEIGHT: 230; z-index: 1; background-color: F2F2F2; layer-background-color: F2F2F2; border: 1px none #000000">
<table cellspacing=5 cellpadding=2 width="560" border="0">
<tr>
<td width="560">“垃圾邮件过滤器”的保护级别被设置成“关闭”。</td>
</tr>

</table>
</div>
<div id=low
style="WIDTH: 560px;POSITION: absolute; HEIGHT: 230; z-index: 2; visibility: hidden; background-color: F2F2F2; layer-background-color: F2F2F2; border: 1px none #000000">
<table cellspacing=5 cellpadding=2 width="560">
<tr >
<td width="1237">“垃圾邮件过滤器”的保护级别被设置成“低”。大部分的电子邮件将会发送到您的“收件箱”。最易于识别的“垃圾邮件”将被分类到“垃圾邮件”文件夹。
<p>您很可能会在“收件箱”中定期收到许多未经请求的邮件（即“垃圾邮件”）。
<p>请您定期查阅“垃圾邮件”文件夹中的内容，并且利用“这不是垃圾邮件”按钮来标识那些不该被过滤到“垃圾邮件”文件夹中的邮件。事先在“通讯簿”或“安全列表”中添加地址可以防止今后来自这些地址的邮件被发送到“垃圾邮件”文件夹。
</p>
</td>
</tr>

</table>
</div>
<div id=high
style="WIDTH: 560px;POSITION: absolute; HEIGHT: 230; z-index: 1; visibility: hidden; background-color: F2F2F2; layer-background-color: F2F2F2; border: 1px none #000000">
<table cellspacing=5 cellpadding=2 width="560">
<tr>
<td width="1237">“垃圾邮件过滤器”的保护级别被设置成“高”。接收的电子邮件将被传送到您的“收件箱”，但大量类似于垃圾邮件的邮件将被分类到“垃圾邮件”文件夹。
<p>“收件箱”中可能仍有少量未经请求的邮件（即“垃圾邮件”），因为大部分的垃圾邮件已被发送到您的“垃圾邮件”文件夹。
“垃圾邮件过滤器”的保护级别被设置成“低”。大部分的电子邮件将会发送到您的“收件箱”。最易于识别的“垃圾邮件”将被分类到“垃圾邮件”文件夹。
<p>您很可能会在“收件箱”中定期收到许多未经请求的邮件（即“垃圾邮件”）。
</td>
</tr>

</table>
</div>
<div id=excl
style="WIDTH: 560px;POSITION: absolute; HEIGHT: 230; z-index: 1; visibility: hidden; background-color: F2F2F2; layer-background-color: F2F2F2; border: 1px none #000000">
<table cellspacing=5 cellpadding=2 width="560">
<tr>
<td width="953">“垃圾邮件过滤器”的保护级别被设置成“专用”。来自“通讯簿”或“安全列表”邮件地址中的邮件将被发送到您的“收件箱”。所有其他的电子邮件则被传送到“垃圾邮件”文件夹。
<p>请您经常查看“通讯簿”以便在“收件箱”中获得所需的邮件。当您给未列在“通讯簿”中的成员发送邮件时，我们会通过提醒您创建一个通讯簿条目使整个过程变得更加简便。
<p>请您查看“垃圾邮件”文件夹中的内容以此来查找有无需要移动到“收件箱”中的邮件，这一步骤是非常重要的，接下来请将发件人的电子邮件地址添加到您的“通讯簿”或“安全列表”。
</p>
</td>
</tr>

</table>
</div>

</td>
</tr>

</table>
<TABLE cellSpacing=0 cellPadding=0 width=560>

<TR>
<TD align=right height="30">
<INPUT class=bottom type=submit value=" 确定 ">

<INPUT class=bottom type=button value=" 取消 " name="Button">
</TD></TR></TABLE>
</FORM>

webasp.net