JSValidation 一个比较优秀的JavaScript客户端验证框架。
作者: Michael Chen(中国人)
作者博客:http://michael.nona.name/
其中中文文档非常全面,很适合我国的开发人员使用。
---------------------------------------------------------------------------------------------------------------------------
使用JSValidation的例子:
1,下载JSValidation
http://cosoft.org.cn/projects/jsvalidation
由于JSValidation框架的文件编码是gb2312,如果您的项目使用的文件编码为gb2312.此步骤可以省略。如果不为gb2312.
下载完成后,请借助文本编辑器把
validation-framework.js,
validation-config.xml,
validation-config.dtd
文件另存为您项目中使用的文件编码。
注意:个人访问时此网址报404. 如果读者需要下载可以借助搜索引擎。在第三方网站下载到。或给本人留言。定会分享给大家。
2,建立web项目,把validation-framework.js,validation-config.xml,
validation-config.dtd,这3个文件放入你的项目,如WebRoot/js目录下
注意:js此目录可以自定义选择。
3,在您的项目中使用JSValidation框架。
打开validation-framework.js,将大约在第21行的 var ValidationRoot=""; 代码更改为:
var ValidationRoot="/您的项目名称/js"; 此步用来指定validation-config.xml文件的位置。
4,编写validation-config.xml文件
将form的id和要验证域的name设置成一致的,每个验证域可以根据自己的需求改变验证方法
下面是xml的代码
<! DOCTYPE validation-config SYSTEM "validation-config.dtd" >
< validation-config lang ="auto" >
< form id ="form1" show-error ="alert" show-type ="all" >
< field name ="username" display-name ="用户名" onfail ="" >
< depend name ="required" />
<depend name="minLength" param0="3"/>
</ field >
< field name ="password" display-name ="密码" >
< depend name ="required" />
< depend name ="commonChar" />
</ field >
</ form >
</ validation-config >
5,在需要验证表单的网页前面加上对JSValidation的引用
然后是表单的onsubmit事件
οnsubmit="return doValidate(this)"
doValidate()中传this或者表单的id的字符串都可以
表单一定要有id,并与后面的xml文件中的id相同
完成以上5步,OK!测试一下吧。
--------------------------------------------------------------------------------------------------------
JSValidation支持的13种验证 :
name 描述 参数含义
required 必须,代表这个域不能为空 无参数
integer: 没有或者必须为整数 无参数
double: 允许为空或者必须为double数 无参数
commonChar 普通英文字符:字母数字和下划线 无参数
chineseChar: 中文字符 无参数
minLength: 最小长度, param0为最小长度数值
maxLength: 最大长度, param0为最大长度数值
email: 必须为Email格式 无参数
date: 必须为日期格式, param0必须为yyyy-mm-dd,或者三个占位符的任意排列顺序。连接字符任意如dd/mm/yyyy
mask: 允许自定义正则表达式来进行校验 param0为表达式字符串
integerRange: 整数范围必须在参数0和参数1之间。 param0和param1必须能被转化成整数
doubleRange: double数的范围必须在参数0和参数1之间 参数0和参数1必须能被转化成Float。
equalsField: 必须与某一个域的值相等 param0:同一个表单中域的名称。例如用来校验密码
其他:
- 文件格式
validation-config.xml是标准文本格式。你可以以任何文本编辑器来编辑它。在正式校验之前,请确保你的xml文件能够正常显示在浏览器中。
- 基本结构
<validation-config> 每个validation-config.xml都有一个validation-config根节点
<form ...> 可以进行一个或者多个form的校验
<field ...> 每个form有一个或者多个需要验证的表单域
<depend ... /> 每个域需要验证的条件可以有一个或者多个
- 节点说明
validation-config: 根节点
属性:lang: 所用的语言,可以是"auto", "zh-cn"(简体中文)或者"en-us"(英文)。默认为auto,可选。
子节点:form, 一个或多个
form: 虚拟表单,通过id映射网页中的表单
属性:id: 映射网页表单中的id,通过这个id,使得jsvalidation与实际网页表单相关联。必须
show-error: 显示错误提示信息的方式。可以是alert(将会显示对话框)或者一个div的id(将会在这
个div中显示错误消息)必须
onfail: 当校验失败时,运行的自定义JS函数。可选(该版本尚未实现)
子节点:field,一个或者多个
field: 虚拟表单域,通过name映射表单中的实际域
属性:name: 表单中的域的名称,例如input name="abc",此处则对应abc。 必须
display-name: 表单的显示名称。当校验失败时,会显示这个属性。必须
onfaile: 与form中的onfail一样。尚未实现。可选
子节点:depend,一个或多个
depend: 校验条件
属性:name: 校验条件的名称,必须为下面指定的13中名称之一,大小写敏感。必须。
param0-param4,5个参数,根据name不同,各有不同取值。