这个简易的验证库,应该能完成90%的基本验证,包括失去焦点时的验证,以及点击提交按钮时的验证。后端的那我就无能为办了,只能是谁用就谁自个儿去写了:)。
先上一段调用的代码吧,JS代码说少也不少了,就不直接贴出来了,文章后面上附件,还包括一个我之前自己写的一个仿人人网的插件的JS文件。
1 <script src="Js/jquery-1.4.2.min.js" type="text/javascript"></script> 2 3 复制代码 4 <script src="Js/ks.ext.msgbox.js" type="text/javascript"></script> 5 <script src="Js/validata.js" type="text/javascript"></script> 6 <form name="form1" id="form1" action="#" method="post"> 7 邮 箱:<input type="text" id="email" name="email" 8 validata="email" errormsg="邮箱格式不正确" emptyerrormsg="邮箱不能为空" empty="false" /><br /> 9 10 手 机:<input type="text" name="phone" validata="phone" 11 errormsg="手机格式不正确" emptyerrormsg="手机不能为空" empty="true" /><br /> 12 13 电 话:<input type="text" name="tel" validata="tel" 14 errormsg="电话格式不正确" emptyerrormsg="电话不能为空" empty="true" /><br /> 15 16 身 份 证:<input type="text" name="idcard" validata="idcard" errormsg="身份证格式不正确" 17 emptyerrormsg="身份证不能为空" empty="false" /><br /> 18 19 密 码:<input type="password" name="pwd" validata="empty" 20 empty="false" emptyerrormsg="密码不能为空" /><br /> 21 22 确认密码:<input type="password" name="pwd1" validata="password2" errormsg="确认密码不能为空" 23 diffmsg="两次密码输入不一致" /><br /> 24 25 <input type="submit" id="submit1" value="Submit" /> 26 复制代码 27 </form>
比如验证邮箱:
有时候邮箱我们是允许为空的,但是一旦输入了邮箱就要求邮箱是合法的。如果允许为空就给empty赋值为true,那么验证库将不对其做非空验证。若为false或者empty属性不加默认就为是不允许为空的。 不允许为空得加上一个emptyErrorMsg的属性,用来显示为空时的错误信息,若这个属性缺少或者值为空那么显示的就是一个红色"*",若不为空就显示这个属性的值。然后就是对格式的验证,是要对邮箱验证,validata的值就是email,若不合法时就显示另外一个自定义属性errorMsg的值,errorMsg若缺少或者为空显示错误信息也为红色"*".
validata的值还是不能完全自定义的,已经在JS中自定好了。就是根据validata的值来返回不同的正则表达式。方法如下,然后可选的validata的值就是下列方法的regName的值。用户若要据展直接再加上其他表达式就可以了。
//根据不同的验证内容,返回相应的正则表达式
function returnRegString(regName) { if (regName == "email") { return "^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$"; //邮箱 } else if (regName == "tel") { return "^(86)?(-)?(0[0-9]{2,3})?(-)?([0-9]{7,8})(-)?([0-9]{3,5})?$"; //电话 } else if (regName == "phone") { return "^(13[0-9]|15[0-9]|18[0-9])([0-9]{8})$"; //手机 } else if (regName == "postcode") { return "^([0-9]{6})$"; //邮编 } else if (regName == "number") { return "^(0|([1-9]+[0-9]*))(.[0-9]+)?$"; //数字 } else if (regName == "decimal") { return "^[0-9]+([.][0-9]+)?$"; //浮点 } else if (regName == "money") { return "^([0-9])$"; //货币 } else if (regName == "website") { //网址 return "(http://|https://){0,1}[w/.?&=]+"; } else if (regName == "fax") { //传真 return "^[+]{0,1}([0-9]){1,3}[ ]?([-]?(([0-9])|[ ]){1,12})+$"; } else if (regName == "int") { //整数 return "^(-){0,1}d+$"; } else if (regName == "pInt") { //正整数 return "^d+$"; } else if (regName == "nInt") { //负整数 return "^-d+$"; } else if (regName == "nandl") { //数字与字母 return "[a-zA-Z0-9]"; } else if (regName == "chinese") { //是否含有中文字符 return "[u4e00-u9fa5]"; } }