注册页面的js验证

时间:2021-12-10 17:12:39

简单的用户注册页面:(html)

包含用户名格式验证、邮箱格式验证、确认密码一致性验证和必填项验证。(纯javascript)

 1 <center>
2 <h1>用户注册</h1>
3 <hr>
4 <SCRIPT type="text/javascript">
5 function isEmail(strEmail) {
6 if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
7 return true;
8 else {
9 alert("邮箱格式不对");
10 return false;
11 }
12 }
13
14 function isUsername(un) {
15 if (un.search(/^[a-zA-Z0-9_]{1,20}$/) != -1) return true;
16 else {
17 alert("用户名只能由1~20位长度的数字、英文字母或者下划线组成");
18 return false;
19 }
20 }
21
22 function checkSubmit() {
23 if (document.getElementById("username").value == "") {
24 alert("请填写用户名!");
25 return false;
26 }
27 if (document.getElementById("email").value == "") {
28 alert("请填写邮箱!");
29 return false;
30 }
31 var pwd1 = document.getElementById("password1");
32 var pwd2 = document.getElementById("password2");
33 if (pwd1.value == "") {
34 alert("请填写密码!");
35 return false;
36 }
37 if (pwd2.value == "") {
38 alert("请再次填写密码!");
39 return false;
40 }
41 if (pwd1.value != pwd2.value) {
42 alert("密码不一致");
43 return false;
44 }
45 }
46 </SCRIPT>
47 <form name="Register" method="post">
48 <table>
49 <tr>
50 <td align="center">用户名*:</td>
51 <td>
52 <input type="text" name="username" id="username" onblur="isUsername(this.value)">
53 </td>
54 </tr>
55 <tr>
56 <td align="center">邮箱*:</td>
57 <td>
58 <input type="text" name="email" id="email" onblur="isEmail(this.value)">
59 </td>
60 </tr>
61 <tr>
62 <td align="center">密码*:</td>
63 <td>
64 <input type="password" id="password1" name="password1">
65 </td>
66 </tr>
67 <tr>
68 <td align="center">密码确认*:</td>
69 <td>
70 <input type="password" name="password2" id="password2">
71 </td>
72 </tr>
73 <tr>
74 <td align="center"><a href="/horizon/auth/login">返回 </a></td>
75 <td>
76 <input type="submit" value="注册!" onclick="return checkSubmit()">
77 </td>
78 </tr>
79 </table>
80 </form>
81 </center>