HTML页面登录时的JS验证方法
register.html:
<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>实验2</title>
<linkhref="check.css"rel="stylesheet"type="text/css">
<scripttype="text/javascript"src="load.js">
</script>
</head>
<!--returnvalidate()和validate()在于是否清空表单-->
<bodyonload="load_greeting()">
<formid="test"align="left"onSubmit="returnvalidate()">
<table>
<tr>
<td>Name*:</td>
<td><inputtype="text"name="Name"id="name"size="20"onChange='check("name")'></td>
<tdid="nameCheck"hidden="true">*姓名不能为空</td>
</tr>
<tr>
<td>Age:</td>
<td><inputtype="text"name="Age"id="age"size="20"onChange='check("age")'></td>
<tdid="ageCheck"hidden="true">*年龄不能小于17岁</td>
</tr>
<tr>
<td>weight:</td>
<td><inputtype="text"name="weight"id="weight"size="20"onChange='check("weight")'></td>
<tdid="weightCheck"hidden="true">*体重范围为30~150KG</td>
</tr>
<tr>
<td>Class:</td>
<td><selectid="class"name="class">
<option>class0</option>
<option>class1</option>
<option>class2</option>
<option>class3</option>
</select>
</td>
</tr>
<tr>
<td>Password*:</td>
<td><inputtype="password"name="Password"id="password"size="20"onChange='check("password")'></td>
<tdid="passwordCheck"hidden="true">*passwordlengthlessthan8</td>
</tr>
<tr>
<td>ConfirmPassword*:</td>
<td><inputtype="password"name="cpassword"id="cpassword"size="20"onChange='check("cpassword")'></td>
<tdid="cpasswordCheck"hidden="true">*Twopasswdisnotsame</td>
</tr>
<tr>
<td>Email*:</td>
<td><inputtype="email"name="email"id="email"size="20"onChange='check(this.id)'></td>
<tdid="emailCheck"hidden="true">*电子邮件名非法！</td>
</tr>
<tr>
<td>TEL:</td>
<td><inputtype="text"name="TEL"id="TEL"size="20"></td>
</tr>
<tr>
<td>QQ:</td>
<td><inputtype="text"name="QQ"id="QQ"size="20"></td>
</tr>
<tr>
<td>PersonalInformation:</td>
<td><textarearows="10"cols="19"></textarea></td>
</tr>
<tr>
<tdcolspan="3">
<inputtype="submit"name="submit">
<inputtype="reset"name="reset">
</td>
</tr>
</table>
</form>
</body>
</html>
check.css:
td.check{
color:#C00;
font-weight:bold;
}
load.js:
functioncheck(str)
{
varx=document.getElementById(str);
vary=document.getElementById(str+"Check");
//alert("check!");
if(str=="name")
{
if(x.value=="")
y.hidden=false;
else
y.hidden=true;
}
elseif(str=="age")
{
if(isNaN(x.value)||x.value<17)
y.hidden=false;
else
y.hidden=true;
}
elseif(str=="weight")
{
x=x.value;
if(isNaN(x)||x<30||x>150)
y.hidden=false;
else
y.hidden=true;
}
elseif(str=="password")
{
x=x.value.length;
if(x<8)
{
y.hidden=false;
//alert("check!");
}
else
y.hidden=true;
}
elseif(str=="cpassword")
{
varz=document.getElementById("password").value;
x=x.value;
if(x!=z)
y.hidden=false;
else
y.hidden=true;
}
elseif(str=="email")
{
x=x.value.indexOf("@")
if(x==-1)
y.hidden=false;
else
y.hidden=true;
}
returny.hidden;
}
functionvalidate()
{
vararr=["name","age","weight","password","cpassword","email"];
vari=0;
submitOK=true;
while(i<=5)
{
if(!check(arr[i]))
{
alert(arr[i]+"wrong!");
submitOK=false;
break;
}
i++;
}
if(submitOK)
{
alert("提交成功！");
returntrue;
}
else
{
alert("提交失败");
returnfalse;
}
}
functionload_greeting()
{
//alert("visit\n");
}