利用JavaScript来用户名和密码进行客户端的验证
校验规则:
1. 用户名只能为数字/字母/英文点号(.), 且不能由数字开始, 至少4位
2. 密码不能由全部重复的字符组成, 不能由连续的数字组成(123456/654321), 至少6位
代码如下:
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JavaScript测试</title>
<script type="text/javascript">
function validate()
{
var username = document.getElementById("username1").value;
var password = document.getElementById("password1").value;
//判断用户名为能为空
if(username=="")
{
alert("用户名不能为空");
return false;
}
//判断用户名第一位不能为数字
if(!isNaN(username.charAt(0)))
{
alert("用户名第一个字符不能为数字");
return false;
}
//判断用户名的长度不能小于4位
if(username.length < 4)
{
alert("用户名不能少于4个字符");
return false;
}
//用户名只能为字母数字以及(.) 英文逗点
for(var i=0;i<username.length;i++)
{
var c = username.charAt(i);
if((c>='a'&&c<='z')||(c>='A'&&c<='Z')||(!isNaN(c))||(c=='.'))
{
continue;
}
else
{
alert("用户名只能为字母数字以及(.) 英文逗点");
return false;;
}
}
//判断密码的长度不能小于6位
if(password.length < 6)
{
alert("密码长度不能小于6位");
return false;
}
//判断密码不能由全部重复的字符组成
for(var j=0;j<password.length;j++)
{
if(password.charAt(j)!=password.charAt(j+1))
{
continue;
}
else
{
alert("密码不能由全部重复字符组成");
return false;
}
}
/*
* 先判断密码是不是全由数字组成
* 再用循环判断他是不是连续的数字
* 这个是判断升序(123456789)
*/
if(!isNaN(password))
{
for(var k=0;k<password.length;k++)
{
if(Number(password.charAt(k))+1!== Number(password.charAt(k+1)))
{
continue;
}
else
{
alert("不能由连续的数字组成(123456789)");
return false;
}
}
}
/*
* 先判断密码是不是全由数字组成
* 再用循环判断他是不是连续的数字
* 这个是判断降序(987654321)
*/
if(!isNaN(password))
{
for(var k=0;k<password.length;k++)
{
if(Number(password.charAt(k))-1!== Number(password.charAt(k+1)))
{
continue;
}
else
{
alert("不能由连续的数字组成(987654321)");
return false;
}
}
}
}
</script>
</head>
<body>
<h1>JavaScript测试</h1>
<form onsubmit="return validate()" action="javascriptsuccess.jsp" method="post">
用户名:<input tyep="text" name="username" id="username1" /><br />
密码: <input type="password" name="password" id="password1" /><br />
<input type="submit" value="提交"/>
<input type="reset" value="重置" />
</form>
</body>
</html>
