<script type="text/javascript"> function check() { var username = document.getElementById("username"); var email = document.getElementById("email").value; var p = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; //邮箱匹配的正则表达式 var password = document.getElementById("password").value; var rePassword = document.getElementById("rePassword").value; var isPass = true; var usernameMsg = document.getElementById("usernameMsg"); var emailMsg = document.getElementById("emailMsg"); var passwordMsg = document.getElementById("passwordMsg"); // console.log(username); // console.log(username.value); var length = username.value.length; if(length < 3 || length > 6) { // alert("用户名长度必须是3-6位"); usernameMsg.innerText = "用户名长度必须是3-6位"; isPass = false; } else { usernameMsg.innerText = ""; } if(p.test(email) == false) { // alert("邮箱格式不正确"); emailMsg.innerText = "邮箱格式不正确"; isPass = false; } else { emailMsg.innerText = ""; } if(password.length < 6 || password.length > 10) { // alert("密码必须在6-10之间"); passwordMsg.innerText = "密码必须在6-10之间"; isPass = false; } else { if(password != rePassword) { // alert("两次输入密码不一致!"); passwordMsg.innerText = "两次输入密码不一致!"; isPass = false; } else { passwordMsg.innerText = ""; } } // if(isPass==false){ // return false; // }else{ // return true; // } return isPass; } function checkUserName(uesrname) { var usernameMsg = document.getElementById("usernameMsg"); var length = username.value.length; if(length < 3 || length > 6) { usernameMsg.innerText = "用户名长度必须是3-6位"; } else { usernameMsg.innerText = ""; } } function checkEmail(email) { var emailMsg = document.getElementById("emailMsg"); var p = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; if(p.test(email.value) == false) { emailMsg.innerText = "邮箱格式不正确"; } else { emailMsg.innerText = ""; } } function checkPassword(){ var password = document.getElementById("password"); var passwordMsg = document.getElementById("passwordMsg"); var rePassword = document.getElementById("rePassword").value; if(password.value.length < 6 || password.value.length > 10) { passwordMsg.innerText = "密码必须在6-10之间"; } else { passwordMsg.innerText = ""; if(password.value != rePassword) { passwordMsg.innerText = "两次输入密码不一致!"; } else { passwordMsg.innerText = ""; } } } </script>
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </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" onblur="checkUserName(this)" /> <font color="red" id="usernameMsg"></font> </td> </tr> <tr> <td align="right">邮箱:</td> <td align="left"> <input type="text" id="email" onblur="checkEmail(this)" /> <font color="red" id="emailMsg"></font> </td> </tr> <tr> <td align="right">密码:</td> <td align="left"> <input type="password" id="password" onblur="checkPassword()"/> <font color="red" id="passwordMsg"></font> </td> </tr> <tr> <td align="right">重复密码:</td> <td align="left"> <input type="password" id="rePassword" onblur="checkPassword()"/> </td> </tr> <tr> <td colspan="2" align="center"><input type="submit" name="注册" /></td> </tr> </table> </form> </body>