<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>注册功能（表单校验）</title>
<script type="text/javascript">
function check() {
//alert("check");
var username = document.getElementById("username");
// console.log(username);
// console.log(username.value);
var isPass = true;
var length = username.value.length;
if (length < 3 || length > 6) {
alert("用户名长度必须是3-6位");
isPass = false;
}
//正则表达式在线测试 https://c.runoob.com/front-end/854
var email = document.getElementById("email").value;
var p = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
if (p.test(email) == false) {
alert("邮箱格式不正确！");
isPass = false;
}
var password = document.getElementById("password").value;
var rePassword = document.getElementById("rePassword").value;
if (password.length < 6 || password.length > 10) {
alert("密码必须在6-10位之间");
isPass = false;
} else {
if (password != rePassword) {
alert("两次输入密码不一致");
isPass = false;
}
}
// if (isPass == false) {
// return false;
// } else {
// return true;
// }
return isPass;
}
</script>
</head>
<body>
<form action="register.jsp" onsubmit="return check()">
<table border="1" width="500px" height="500px">
<tr>
<td colspan="2" align="center">注册</td>
</tr>
<tr>
<td align="right">用户名：</td>
<td align="left"><input type="text" id="username" /></td>
</tr>
<tr>
<td align="right">邮箱：</td>
<td><input type="text" id="email" /></td>
</tr>
<tr>
<td align="right">密码：</td>
<td><input type="password" id="password" /></td>
</tr>
<tr>
<td align="right">重复密码：</td>
<td><input type="password" id="rePassword" /></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" value="注册" /></td>
</tr>
</table>
</form>
</body>
</html>
