点击单选按钮隐藏下拉选项
<%@ page language="java" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>酷猫教育网</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="expires" content="-1" />
<meta name="keywords" content="视频教育,网络教学,暑期补课,名师补习班" />
<meta name="description" content="暑期补习,学习方法,数理化补课哪里最好?酷猫教育网最好!,远程教学" />
<meta name="author" content="edu.kum.kum.net.cn, 酷猫教育" />
<meta name="copyright" content="www.kum.net.cn,酷猫信息" />
<script>
function $(id){
return document.getElementById(id);
}
function add(s,t){
$("soojs.com").value=parseInt(s)+t;
}
</script>
<style type="text/css">
body {
font: 12px Tahoma;
text-align: center;
background: #0000rr;
}
.table1 {
font-size: 12px;
color: #000000;
}
.input {
width: 60px;
height: 20px;
background-color: #D0DFFF;
font-size: 15px;
color: #666699
}
.zhuce_con01 {
font-size: 14px;
line-height: 25px;
margin-top: 5px;
color: #666666;
}
.btn {
BORDER-RIGHT: #7b9ebd 1px solid;
PADDING-RIGHT: 2px;
BORDER-TOP: #7b9ebd 1px solid;
PADDING-LEFT: 2px;
FONT-SIZE: 12px;
FILTER: progid :DXImageTransform.Microsoft .Gradient(GradientType =0,StartColorStr =#ffffff, EndColorStr= #cecfde);
BORDER-LEFT: #7b9ebd 1px solid;
CURSOR: hand;
COLOR: black;
PADDING-TOP: 2px;
BORDER-BOTTOM: #7b9ebd 1px solid
}
</style>
<script type="text/javascript">
function validate()
{
var resualt=false;
for(var i=0;i<document.form1.r.length;i++)
{
if(document.form1.r[i].checked)
{
resualt=true;
}
}
if(!resualt)
{
alert("请选择一个用户类型！");
return resualt;
}
/**
var choose=form1.r[i].value);
var xue = document.form1.r.value;
if(xue!=0){
document.write("用户类型"+xue);
return false;
if(document.form1.r[i].value==1){
document.form1.UserClass.style.display="none";
return false;
}
}
*/
if(document.form1.UserName.value.length==0)
{
document.getElementById("username1").innerHTML="<font color='red'>×用户名不能为空</font>";
document.form1.UserName.focus();
return false;
}
else{
document.getElementById("username1").innerHTML="<font color='blue'>√用户名正确</font>";
}
if(document.form1.UserTel.value.length==0){
document.getElementById("usertel1").innerHTML="<font color='red'>×电话号码和手机号码至少选填一个阿</font>";
document.form1.UserTel.focus();
return false;
}
else{
document.getElementById("usertel1").innerHTML="<font color='blue'>√格式正确</font>";
}
if(document.form1.UserTel.value!= ""){
var phone=document.form1.UserTel.value;
var p1=/(^[0-9]{3,4}\-[0-9]{7,8}$)|(^[0-9]{7,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/;
var me = false;
if (p1.test(phone))me=true;
if (!me){
document.form1.UserTel.value='';
document.getElementById("usertel1").innerHTML="<font color='red'>×您输入的电话号码有错误。区号和电话号码之间请用-分割</font>";
document.form1.UserTel.focus();
return false;
}
else{
document.getElementById("usertel1").innerHTML="<font color='blue'>√您输入的格式正确</font>";
}
}
if (document.form1.UserEmail.value.indexOf('.')==-1 || document.form1.UserEmail.value.indexOf('@')==-1){
document.getElementById("useremail1").innerHTML="<font color='red'><font color='red'>×邮箱必须包含.和@</font>";
document.form1.UserEmail.focus();
return false;
}
else{
document.getElementById("useremail1").innerHTML="<font color='blue'><font color='blue'>√邮箱格式正确</font>";
}
if(document.form1.answer.value.length==0){
document.getElementById("answer1").innerHTML="<font color='red'>×问题答案不能为空，请正确填写信息！</font>";
document.form1.answer.focus();
return false;
}
else{
document.getElementById("answer1").innerHTML="<font color='blue'><font color='blue'>√好的!请保管好，方便找回账号</font>";
}
return true;
}
</script>
</head>
<body>
<h3 id="pgtitle">
kum视频教学账号申请
</h3>
<p id="pgtitletext">
要求填写所有信息。带*号的必填
</p>
<div class="bluebar">
</div>
<font size="2" color="blue" style="margin-left: 1300px;">填写基本信息 | kum教学软件</font>
<hr>
<form action="UserLoginServlet" name="form1" method="post"
onsubmit="return(validate())">
<table width="50%" border="0" class="table1" align="center"
style="margin-top: 80px;" bgcolor="">
<tr>
<td width="25%" height="22" align="right">
用户选择：
<br>
</td>
<!-- style="display:none" 设置下拉单选按钮的隐藏 -->
<td height="22" colspan="2" align="left">
<input type="radio" name="r" value="1" id="cc"
onclick="qq.style.display='none'">
一般用户
<input type="radio" name="r" value="0" id="cc"
onclick="qq.style.display='block'">
学生
</td>
</tr>
<tr>
<td width="25%" height="22" align="right">
用户姓名：
<br>
</td>
<td height="22" colspan="2" align="left">
<input name="UserName" id="UserName" type="text" class="form"
size="32" />
*
<span id="username1">(请填写正确的用户名)</span>
</td>
</tr>
<tr>
<td width="25%" height="22" align="right">
电话号码：
<br>
</td>
<td height="22" colspan="2" align="left">
<input name="UserTel" id="UserTel" type="text" class="form"
size="32" />
*
<span id="usertel1">(请填写正确的号码，可以固定电话也可以是手机号码)</span>
</td>
</tr>
<tr>
<td width="25%" height="22" align="right">
用户邮箱：
</td>
<td height="22" colspan="2" align="left">
<input name="UserEmail" id="UserEmail" type="text" class="form"
size="32" />
*
<span id="useremail1">(请填写真实的E-mail地址(如:[email protected])，方便找回密码)</span>
</td>
</tr>
</table>
<div id="qq">
<table width="50%" border="0" class="table1" align="center">
<tr>
<td width="25%" height="22" align="right" id="car5">
学生年级：
</td>
<td height="22" colspan="2" align="left">
<select name="UserClass" class="form">
<option value="一年级">
一年级
</option>
<option>
二年级
</option>
<option>
三年级
</option>
<option>
四年级
</option>
<option>
五年级
</option>
<option>
六年级
</option>
<option>
初一年级
</option>
<option>
初二年级
</option>
<option>
初三年级
</option>
<option>
高一年级
</option>
<option>
高二年级
</option>
<option>
高三年级
</option>
</select>
</td>
</tr>
</table>
</div>
<table width="50%" border="0" class="table1" align="center" style="margin-left: 200px;">
<tr>
<td height="22" align="right">
验证码：
</td>
<td height="22" colspan="2" align="left">
<input name="chknumber" id="chknumber" type="text" class="type1"
style="color: #808080; ime-mode: disabled;" size="32"
maxlength="32" value="输入字符，不区分大小写"
onfocus="if(value=='输入字符，不区分大小写'){value=''}" />
<img src="CheckCodeServlet" width="80" id="code"
onclick="javascript:document.getElementById('code').src='CheckCodeServlet';return false;"
class="input" />
</td>
</tr>
<tr>
<td height="22" align="right">
回答问题:
</td>
<td height="22" colspan="2" align="left">
<select name="ask" class="form" id="ask">
<option value=您父亲或者母亲的姓名>
您父亲或者母亲的姓名
</option>
<option>
你的出生地
</option>
<option>
你童年最好的朋友
</option>
</select>
<span id="ask1"></span>
</td>
</tr>
<tr>
<td height="22" align="right">
问题答案:
</td>
<td>
<input name="answer" id="answer" type="text" class="form"
size="32" />
*
<span id="answer1">(填写正确的信息)</span>
</td>
</tr>
<tr>
<td height="22" align="right">
</td>
<td>
<input type="submit" class=btn title="同意" value="同意" id="tijiao" />
<input type="reset" class=btn title="重置">
<input type="button" class=btn title="找回密码" value="找回帐号"
onClick="window.location.reload('find.jsp');">
<P></p>
</td>
</tr>
</table>
</form>
<div style="margin-top: 200px;" align="center">
<hr>
<span><font size="2"><strong>Copyright ©
1998-2010 Tencent Inc. All Rights Reserved</strong></font> <font size="2">酷猫公司，版权所有</font> </span>
</div>
</body>
</html>