JavaScript + 正则表达式 完成一个简单表单验证
自己写了个简单表单验证：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>表单验证</title><script language="javascript">function checkUserNum(str){if(str.length<3 || str.length>18){document.getElementById("usernumErr").innerHTML = "<font color='red'>帐号长度在3-18字符内</font>";form1.password.focus();return false;} var flag = str.match(/\D/)==null; if(!flag==true){ document.getElementById("usernumErr").innerHTML = "<font color='red'>帐号必须有0-9数字组成</font>"; form1.usernum.focus(); return false; } document.getElementById("usernumErr").innerHTML = ""; return true;};function checkUserName(username){if(username.length == 0){document.getElementById("usernameErr").innerHTML = "<font color='red'>用户名不能为空</font>";form1.username.focus();return false;}var patn = /^++$/;if(!patn.test(username)){document.getElementById("usernameErr").innerHTML = "<font color='red'>用户名只能由英文字母或数字组成(不支持中文、不能以数字开头)</font>";form1.username.focus();return false;}document.getElementById("usernameErr").innerHTML = "";return true;};function checkPwd(str){if(str.length<3 || str.length>18){document.getElementById("passwordErr").innerHTML = "<font color='red'>密码长度在3-18字符内</font>";form1.password.focus();return false;}if(escape(str).indexOf("%u")!=-1){document.getElementById("passwordErr").innerHTML = "<font color='red'>密码不能含有中文</font>";form1.password.focus();return false;} document.getElementById("passwordErr").innerHTML = ""; return true;};function confrimPwd(str){var pwd = document.form1.password.value;if(str!=pwd){document.getElementById("password2Err").innerHTML = "<font color='red'>密码不一致!</font>";form1.password2.value="";form1.password2.focus();return false;} document.getElementById("password2Err").innerHTML = ""; return true;};function checkEmail(email){ if(email==""){document.getElementById("emailErr").innerHTML = "<font color='red'>Email不能为空</font>";form1.email.focus();return false; } var reg=new RegExp("^+@+[\.]{1}+[\.]?+$"); if(!reg.test(email)){ document.getElementById("emailErr").innerHTML = "<font color='red'>E-MAIL格式输入不正确!</font>"; form1.email.focus(); return false; } document.getElementById("emailErr").innerHTML = ""; return true;};function checkTel(tel){ var i,j,strTemp;strTemp="0123456789-()#";for(i=0;i<tel.length;i++){j=strTemp.indexOf(tel.charAt(i));if(j==-1){document.getElementById("telErr").innerHTML = "<font color='red'>Tel格式输入不正确!</font>";form1.tel.focus();return false;}}document.getElementById("telErr").innerHTML = "";return true;};function checkForm(){if(document.form1.usernum.value.length == 0){document.getElementById("usernumErr").innerHTML = "<font color='red'>帐号不能为空</font>";form1.usernum.focus();return false;}if(document.form1.username.value.length == 0){document.getElementById("usernameErr").innerHTML = "<font color='red'>用户名不能为空</font>";form1.username.focus();return false;}if(document.form1.password.value.length == 0){document.getElementById("passwordErr").innerHTML = "<font color='red'>密码不能为空</font>";form1.password.focus();return false;}if( !(form1.sex.checked || form1.sex.checked) ){document.getElementById("sexErr").innerHTML = "<font color='red'>请选择性别</font>";form1.sex.focus();return false;}if(document.form1.email.value==""){document.getElementById("emailErr").innerHTML = "<font color='red'>Email不能为空</font>";form1.email.focus();return false; }document.getElementById("usernumErr").innerHTML = "";document.getElementById("usernameErr").innerHTML = "";document.getElementById("passwordErr").innerHTML = "";document.getElementById("sexErr").innerHTML = "";document.getElementById("emailErr").innerHTML = "";return true;};</script></head><body><form name="form1" action="#" method="post"><table width="0" border="1"> <tr> <th scope="row">UserNumber:</th> <td> <input type="text" name="usernum"/> <span id="usernumErr"></span> </td> </tr> <tr> <th scope="row">UserName:</th> <td> <input type="text" name="username"/> <span id="usernameErr"></span> </td> </tr> <tr> <th scope="row">PassWord:</th> <td> <input type="password" name="password"/> <span id="passwordErr"></span> </td> </tr> <tr> <th scope="row">ConfirmPassword:</th> <td> <input type="password" name="password2"/> <span id="password2Err"></span> </td> </tr> <tr> <th scope="row">sex</th> <td> <input type="radio" name="sex" value="男" />男 <input type="radio" name="sex" value="女" />女 <span id="sexErr"></span> </td> </tr> <tr> <th scope="row">Email:</th> <td> <input type="text" name="email"/> <span id="emailErr"></span> </td> </tr> <tr> <th scope="row">Tel:</th> <td> <input type="text" name="tel"/> <span id="telErr"></span> </td> </tr> <tr> <th scope="row">&nbsp;</th> <td>&nbsp;</td> </tr> <tr> <th scope="row"><input type="submit" value="submit" /></th> <td><input type="reset" value="reset" /></td> </tr></table></form></body></html>
页:
[1]