统一的表单校验功能_表间校验功能页面-CSDN博客

说明：校验功能完全基于JQUERY和前人开发的JS库进行，本文仅对其中常用的功能作

详尽描述

所需要的JS文件可以从以下地址下载，如果该地址无法访问，可以发邮件索取：johennes@foxmail.com

1. 原生版本：通用FormValid1.0-js验证框架，压缩包内包含多个DEMO，基本涵盖所有的校验功能。

2. 本人修改调试版本：通用FormValid(个人修改版)，把DEMO去掉了（节约空间，什么？没有DEMO不会用了，看下面！！！）

接下来的部分就是我对于一般表单校验常用功能的总结（=。=|| 不就是DEMO里的

么，没错，我将多个DEMO文件内的校验类型提炼出来，写了一份总结篇）

最终使用效果：

使用说明：

1. 在需要进行校验的页面中引用（FormValid.js，FV_onBlur.js，PasswordStrength.js），当然JQUERY的包也是必须的啦。

2. 在表单页面最后添加以下JS代码：initValid(document.submitForm);

其中“submitForm”为需要提交的表单form

3. 在需要验证的表单输入框代码中增加属性valid，具体属性值如下

valid的值	说明	备注
required	必填性
eqaul	和另一元件对比值是否相同	对比的元件名在元件加上属性eqaulName
gt	和另一元件对比值是否大于另一元件值	对比的元件名在元件加上属性eqaulName
isEmail	电子邮件
isPassWord	检查密码强度	可配合limit使用，例： <input type="password" valid="limit\|isPassWord" min="6" max="18" id="pass" name="pass" errmsg="长度必须在6-18字符之间!\|密码强度太弱"/> <span id="errMsg_pass" name="errmsg" style="color:#FF0000"></span>
isMobile	手机号码
isPhone	电话号码
isTelephone	电话号码或手机
isDate	日期
isTime	时间
isInt	整数
isNumber	数字
isIdCard	身份证
isMoney	货币
isZip	邮编
isEnglish	英语
isChinese	中文
isUrl	URL地址
limit	长度限制	需补充min="2" max="5"两个属性 <input name="Limit" type="text" id="Limit" valid="limit" min="2" max="5" errmsg="长度必须在2-5之间!" />
range	值范围限制	需补充min="10" max="20"两个属性 <input name="Range" type="text" id="Range" valid="range" min="10" max="20" errmsg="值必须在10-20之间!" />
requireChecked	单选框必选	type="radio"时使用 <input name="rc[]" type="radio" valid="requireChecked" errmsg="radio必须选择一个!" value="2" />
	复选框必选	type="checkbox"时使用，需补充min="2" max="4"两个属性 <input name="cc[]" type="checkbox" valid="requireChecked" min="2" max="4" errmsg="checkbox必须选择2-4个!" value="5" />
filter	扩展名限制	需补充allow="jpg, gif"属性 <input name="file" type="file" valid="filter" allow="jpg, gif" errmsg="只能选择jpg gif!" />
isNo	值不等于	需补充noValue="abc"属性 <input name="no" type="text" id="no" valid="isNo" noValue="abc" errmsg="值不能是abc!" />
regexp	自定义规则	需补充regexp="^[a-z]+$"属性 <input name="username" type="text" valid="required\|regexp" regexp="^[a-z]+$" errmsg="用户名不能为空!\|只能是a-z" />
custom	自定义函数规则	需补充custom="customFuntion"属性 <input name="A" type="text" value="" /> <input name="B" type="text" valid="custom" custom="customFuntion" errmsg="A和B必需填写其中一个" /> function customFuntion(inp,frms) { if (inp.value \|\| frms['A'].value) { return true; } return false; } 在此基础上可以扩展成其他任何方法，比如调用AJAX验证表单内容等