- 浏览: 55027 次
- 性别:
- 来自: 上海
文章分类
最新评论
-
qinhu0811:
亲,能提供以下源码吗?393383316@qq.com
MenuBar加双层ViewStack构建FLEX整站导航 -
guanshubang:
JUnit -
guanshubang:
JUnit
客户端表单验证框架JSValidation《用户手册》转自:
http://hi.baidu.com/yb030832/blog/item/ff96801b4453e4ffaf5133a0.html
1. JSValidation是什么? [top]
如首页所说,JSValidation是客户端表单验证框架,用在BS系统中,或者简单的网页系统中。表单验证在这些开发中很常见:新用户注册,需要校验某些字段;用户登陆,需要校验;等等。在这之前,页面开发者(JavaScript开发者)需要编写大量的JavaScript来与表单对象交互,并进行校验。常见的校验如不能为空,必须满足长度要求,必须为数字,必须为Email等等。根据一般的经验,如果表单中需要校验的域个数超过10个,开发过程就显得枯燥无味——多段重复的代码不断重复,如果要求跨浏览器,更多的考虑因素使人头疼不已。往往这个页面的验证还不能用于那个验证……虽然逻辑基本相同;但是在大多数情况下,出于种种原因,开发者宁愿(或者没办法)重新编写另一个页面的JavaScript代码。
JSValidation致力于改善这一过程。它将常见的校验(目前支持13种)封装起来,并创造性的采用xml来存贮表单验证信息,使得表单的验证成为整个项目中最不重要的环节,开发者只需要定义几个xml标记,就可以创建出复杂的验证策略,而不用编写一行JavaScript代码。由于采用xml集中管理表单验证,使得表单验证在整个系统中的耦合度大大降低,并且易维护性大大提高。开发者更多的精力可以投入到业务相关的代码中。
恰恰相反,JSValidation内部结构虽然不太简单(对用户而言),但是调用方式却极其简单,配置好环境后,只需要在需要验证的表单的HTML标记中加上onsubmit="return doValidate('formId')"即可。这并没有改变开发者的习惯。
更为明显的优势是,JSValidation具备跨浏览器的能力。在目前的测试环境下,支持IE5及以上版本,Mozilla系列和支持DOM2模型的其他浏览器。你不用再考虑在多浏览器下如何兼容,JSValidation帮你做到了这些。
2. JSValidation能做什么,不能做什么? [top]
如上所述,JSValidation能够校验表单。在系统复杂,表单复杂的场景下,JSValidation的优势更加突出。JSValidation目前能够完成客户端的13种验证如下:
取值非空
必须为整数
必须为双精度数
必须为普通英文字符(字母,数字,下划线)
必须为中文字符
最小长度
最大长度
是否为Email格式
是否为日期格式(yyyy-mm-dd)
自定义的正则表达式
整数范围(大于某数小于某数)
双精度数范围
必须与某个域的值相同
所有这些验证都在客户端完成。如果还有在此之外的验证需求,请告诉我们,我们会跟据需求程度开发出新的验证模型。
JSValidation不能做的:
跨页面的验证。例如,A页面输入值,必须满足B页面中某一个值的条件,或者更多的页面。这个需求需要用户的反馈。如果在现实开发中这种需求很普遍,我们会考虑开发。目前的替代方式是,将A页面需要验证的值POST到B页面的一个Hidden Field,然后再使用已有的验证方式。
与服务器交互验证。最常见的是输入用户名密码后登录。限于它的表示范围,JSValidation不能完成这个工作。
其他没有提到的,很希望你能告诉我们。
3. 什么情况下,我应该使用JSValidation? [top]
答案是,如果没有现成的验证参考,就使用它吧。
有很多的开发工具、开发框架(模型)都已经提供了验证支持,如ASP.NET,Struts。但是还有更多的Framework没有提供支持,例如我们使用的Velocity(也许它不能称为框架),以及其他的ASP, PHP, Pure JSP, CGI等等。也许没有成熟的框架使用。如果没有,JSValidation也许能够帮助你减轻客户端校验编程的压力,让你有更多的精力投入对业务的关注中。
另外,如果你的系统很小,或者系统中需要校验的很少——例如只有一个登陆的用户名、密码需要校验,那么基于性能考虑,我们不建议你采用JSValidation。JSValidation库文件达到22KB,加上验证文件,也许要在你的页面上加载额外的26K+才能运行。而相同的功能,自己按照常规方式写也不过几行。
当然,如果你现有的开发过程中已经有了自己的模型,很熟悉也很牢固了,尽可能采用你自己的方式吧。JSValidation并非久经考验(before v1.0b)。
4. 快速开始 [top]
你可以有两种方法快速开始(看到效果)
直接查看Demo页面 (goto>>)
下载最新的版本,直接在本地查看。(goto>>)
无论是那种方法,演示的例子中都有详细的步骤,以及对应的代码。
5. 使用流程 [top]
以下介绍在实际开发中,如何配置使用JSValidation。在开始这些步骤之前,请保证你下载了最新版本的jsvalidation-framework.js文件。
5.1 配置环境 [top]
首先将jsvalidation-framework.js和validation-config.xml复制到网站的某一目录下,例如/javascripts。
打开jsvalidation-framework.js,找到var ValidationRoot = ""; 将这行代码更改为var ValidationRoot = "/javascripts/"; (就是validation-config.xml文件的位置)。
在你需要进行校验的页面中,加入jsvalidation的引用:
<script language="javascript" src="/javascripts/jsvalidation-framework.js"></script>
在该页面需要验证的表单Form标记中,加入on submit="return doValidate('formId')"。其中formID是该Form的id。
完成。
5.2 编写validation-config.xml [top]
validation-config.xml是集中管理表单的存放点,也是JSValidation处理验证条件的地方。
- 文件格式
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不同,各有不同取值。
一个范例: <!--校验登陆,简单。复杂的例子请看Demo-->
<validation-config>
<form id="loginForm" show-error="alert" onfail="">
<field name="username" display-name="用户名" onfail="">
<depend name="required" />
<depend name="commonChar" />
</field>
<field name="password" display-nam="密码" onfail="">
<depend name="required" />
</field>
</form>
</validation-config>
5.3 校验表单 [top]
编写完validation-config.xml后,就可以按照上面的部署方法进行部署。
6 JSValidation支持的13种验证 [top]
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:同一个表单中域的名称。例如用来校验密码
另外一篇有实例的:
JSValidation 验证框架的使用
http://polokang.iteye.com/blog/350607
http://hi.baidu.com/yb030832/blog/item/ff96801b4453e4ffaf5133a0.html
1. JSValidation是什么? [top]
如首页所说,JSValidation是客户端表单验证框架,用在BS系统中,或者简单的网页系统中。表单验证在这些开发中很常见:新用户注册,需要校验某些字段;用户登陆,需要校验;等等。在这之前,页面开发者(JavaScript开发者)需要编写大量的JavaScript来与表单对象交互,并进行校验。常见的校验如不能为空,必须满足长度要求,必须为数字,必须为Email等等。根据一般的经验,如果表单中需要校验的域个数超过10个,开发过程就显得枯燥无味——多段重复的代码不断重复,如果要求跨浏览器,更多的考虑因素使人头疼不已。往往这个页面的验证还不能用于那个验证……虽然逻辑基本相同;但是在大多数情况下,出于种种原因,开发者宁愿(或者没办法)重新编写另一个页面的JavaScript代码。
JSValidation致力于改善这一过程。它将常见的校验(目前支持13种)封装起来,并创造性的采用xml来存贮表单验证信息,使得表单的验证成为整个项目中最不重要的环节,开发者只需要定义几个xml标记,就可以创建出复杂的验证策略,而不用编写一行JavaScript代码。由于采用xml集中管理表单验证,使得表单验证在整个系统中的耦合度大大降低,并且易维护性大大提高。开发者更多的精力可以投入到业务相关的代码中。
恰恰相反,JSValidation内部结构虽然不太简单(对用户而言),但是调用方式却极其简单,配置好环境后,只需要在需要验证的表单的HTML标记中加上onsubmit="return doValidate('formId')"即可。这并没有改变开发者的习惯。
更为明显的优势是,JSValidation具备跨浏览器的能力。在目前的测试环境下,支持IE5及以上版本,Mozilla系列和支持DOM2模型的其他浏览器。你不用再考虑在多浏览器下如何兼容,JSValidation帮你做到了这些。
2. JSValidation能做什么,不能做什么? [top]
如上所述,JSValidation能够校验表单。在系统复杂,表单复杂的场景下,JSValidation的优势更加突出。JSValidation目前能够完成客户端的13种验证如下:
取值非空
必须为整数
必须为双精度数
必须为普通英文字符(字母,数字,下划线)
必须为中文字符
最小长度
最大长度
是否为Email格式
是否为日期格式(yyyy-mm-dd)
自定义的正则表达式
整数范围(大于某数小于某数)
双精度数范围
必须与某个域的值相同
所有这些验证都在客户端完成。如果还有在此之外的验证需求,请告诉我们,我们会跟据需求程度开发出新的验证模型。
JSValidation不能做的:
跨页面的验证。例如,A页面输入值,必须满足B页面中某一个值的条件,或者更多的页面。这个需求需要用户的反馈。如果在现实开发中这种需求很普遍,我们会考虑开发。目前的替代方式是,将A页面需要验证的值POST到B页面的一个Hidden Field,然后再使用已有的验证方式。
与服务器交互验证。最常见的是输入用户名密码后登录。限于它的表示范围,JSValidation不能完成这个工作。
其他没有提到的,很希望你能告诉我们。
3. 什么情况下,我应该使用JSValidation? [top]
答案是,如果没有现成的验证参考,就使用它吧。
有很多的开发工具、开发框架(模型)都已经提供了验证支持,如ASP.NET,Struts。但是还有更多的Framework没有提供支持,例如我们使用的Velocity(也许它不能称为框架),以及其他的ASP, PHP, Pure JSP, CGI等等。也许没有成熟的框架使用。如果没有,JSValidation也许能够帮助你减轻客户端校验编程的压力,让你有更多的精力投入对业务的关注中。
另外,如果你的系统很小,或者系统中需要校验的很少——例如只有一个登陆的用户名、密码需要校验,那么基于性能考虑,我们不建议你采用JSValidation。JSValidation库文件达到22KB,加上验证文件,也许要在你的页面上加载额外的26K+才能运行。而相同的功能,自己按照常规方式写也不过几行。
当然,如果你现有的开发过程中已经有了自己的模型,很熟悉也很牢固了,尽可能采用你自己的方式吧。JSValidation并非久经考验(before v1.0b)。
4. 快速开始 [top]
你可以有两种方法快速开始(看到效果)
直接查看Demo页面 (goto>>)
下载最新的版本,直接在本地查看。(goto>>)
无论是那种方法,演示的例子中都有详细的步骤,以及对应的代码。
5. 使用流程 [top]
以下介绍在实际开发中,如何配置使用JSValidation。在开始这些步骤之前,请保证你下载了最新版本的jsvalidation-framework.js文件。
5.1 配置环境 [top]
首先将jsvalidation-framework.js和validation-config.xml复制到网站的某一目录下,例如/javascripts。
打开jsvalidation-framework.js,找到var ValidationRoot = ""; 将这行代码更改为var ValidationRoot = "/javascripts/"; (就是validation-config.xml文件的位置)。
在你需要进行校验的页面中,加入jsvalidation的引用:
<script language="javascript" src="/javascripts/jsvalidation-framework.js"></script>
在该页面需要验证的表单Form标记中,加入on submit="return doValidate('formId')"。其中formID是该Form的id。
完成。
5.2 编写validation-config.xml [top]
validation-config.xml是集中管理表单的存放点,也是JSValidation处理验证条件的地方。
- 文件格式
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不同,各有不同取值。
一个范例: <!--校验登陆,简单。复杂的例子请看Demo-->
<validation-config>
<form id="loginForm" show-error="alert" onfail="">
<field name="username" display-name="用户名" onfail="">
<depend name="required" />
<depend name="commonChar" />
</field>
<field name="password" display-nam="密码" onfail="">
<depend name="required" />
</field>
</form>
</validation-config>
5.3 校验表单 [top]
编写完validation-config.xml后,就可以按照上面的部署方法进行部署。
6 JSValidation支持的13种验证 [top]
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:同一个表单中域的名称。例如用来校验密码
另外一篇有实例的:
JSValidation 验证框架的使用
http://polokang.iteye.com/blog/350607
发表评论
-
GOF以及java的23种设计模式简介
2010-01-08 20:08 1290FROM:http://fsjoy.blog.51cto.co ... -
用Spring AOP实现开发中松散耦合
2010-01-08 20:04 976FROM:http://soft.yesky.com/76/2 ... -
Hibernate过滤器的高级应用
2010-01-08 19:59 947FROM:http://developer.51cto.com ... -
Struts2教程10:国际化
2010-01-08 19:54 937FROM:http://www.blogjava.net/no ... -
Struts2教程9:实现自已的拦截器
2010-01-08 19:52 845FROM:http://www.blogjava.net/no ... -
Struts2教程8:拦截器概述
2010-01-08 19:50 765FROM:http://www.blogjava.net/no ... -
Struts2教程7:上传任意多个文件
2010-01-08 19:49 1003FROM:http://www.blogjava.net/no ... -
Struts2教程6:在Action类中获得HttpServletResponse对象的四种方法
2010-01-08 19:46 965FROM:http://www.blogjava.net/no ... -
Struts2教程5:使用Validation框架验证数据
2010-01-08 19:45 752FROM:http://www.blogjava.net/no ... -
Struts2教程4:使用validate方法验证数据
2010-01-08 19:40 889FROM:http://www.blogjava.net/no ... -
Struts2教程3:struts.xml常用配置解析
2010-01-08 19:39 1089FROM:http://www.blogjava.net/no ... -
Struts2教程2:处理一个form多个submit
2010-01-08 19:37 763FROM:http://www.blogjava.net/no ... -
Struts1.x系列教程(2):简单的数据验证
2010-01-08 19:32 996FROM:http://www.blogjava.net/no ... -
Struts1.x系列教程(1):用MyEclipse开发第一个Struts程序
2010-01-08 19:24 848FROM:http://www.blogjava.net/no ... -
JSP语法详解
2010-01-08 19:17 818FROM:http://www.jspcn.net/htmln ... -
fckeditor 2.6 for jsp 配置
2010-01-08 19:13 1027fckeditor 2.6 for jsp 配置:转自 htt ... -
Java7新特性
2010-01-07 18:30 2292Java7新特性 1.运行速度提高了,这个得益于Java7采用 ... -
java和javaw
2010-01-07 12:42 1288java命令运行你的程序时,是置程序于前台;而javaw是则置 ... -
反编译.class文件为.java文件
2010-01-07 12:20 848Mocha是第一个反编译软件. http://www.brou ... -
Eclipse不能自动编译的问题
2009-12-24 19:05 826有时会碰到Eclipse不能自动编译的问题.就算你在项目菜单里 ...
相关推荐
**JSP客户端表单验证框架JSValidation** JSValidation是一款基于JavaScript的轻量级表单验证框架,主要用于在JSP(JavaServer Pages)应用中实现客户端的表单数据验证。它提供了一种简单、高效的手段来确保用户在...
### 使用客户端验证框架JSValidation详解 #### 一、概述 在现代Web开发中,表单验证是一项非常重要的功能。为了确保用户输入的数据符合预期的格式和规则,开发人员经常需要编写大量的JavaScript代码来处理各种各样...
总的来说,**JS客户端表单验证框架**是一个强大且灵活的工具,它极大地简化了前端表单验证的工作,提升了开发效率和用户体验。通过学习和运用这个框架,开发者可以更专注于业务逻辑,而非基础的验证实现,从而更好地...
如首页所说,JSValidation是客户端表单验证框架,用在BS系统中,或者简单的网页系统中。表单验证在这些开发中很常见:新用户注册,需要校验某些字段;用户登陆,需要校验;等等。在这之前,页面开发者...
JSValidation是一个客户端JavaScript验证框架,专门用于BS系统(Brower-Server)或简单的网页系统中的表单验证。它的主要目标是简化表单验证过程,减少开发者编写重复的JavaScript代码。通过封装常见的验证规则...
它将常见的校验(目前支持13种)封装起来,并创造性的采用xml来存贮表单验证信息,使得表单的验证成为整个项目中最不重要的环节,开发者只需要定义几个xml标记,就可以创建出复杂的验证策略,而不用编写一行...
"基于JavaScript的客户端表单验证.pdf" 基于JavaScript的客户端表单验证是指在客户端使用JavaScript语言来实现表单验证的技术。这种技术可以在用户提交表单之前对表单数据进行验证,从而避免了非法数据的提交和...
如首页所说,JSValidation是客户端表单验证框架,用在BS系统中,或者简单的网页系统中。表单验证在这些开发中很常见:新用户注册,需要校验某些字段;用户登陆,需要校验;等等。在这之前,页面开发者...
总的来说,"强大的表单验证框架"为开发者提供了强大而灵活的工具,能够有效地管理和控制用户输入,保证了数据的完整性和系统稳定运行,是构建高质量Web应用的重要组成部分。通过深入理解和熟练运用此类框架,开发者...
实现效果: html5客户端表单验证,客户端验证,在商城中会大量使用,当你注册会员时、客户端要对表单的数据进行验证,不符合就不发送到后端验证,html5客户端验证,php中文网推荐下载!
JSValidation 是一个专为BS(Browser-Server)系统设计的客户端表单验证框架,旨在简化和标准化网页应用中的表单验证流程。它通过封装常见的验证规则,利用XML来存储和配置验证信息,极大地降低了开发者的工作量,...
formvalidator 是一个强大的前端表单验证框架,专为开发者提供高效、灵活的表单数据验证解决方案。这个框架允许开发者在用户提交表单前检查输入的数据,确保数据的完整性和准确性,从而提高用户体验并减少服务器端的...
在网页开发中,客户端表单验证是至关重要的一个环节,它能确保用户输入的数据符合预设的规则,提高用户体验并减轻服务器的压力。本示例"js 客户端表单验证示范"提供了一种简洁的方法来实现这一功能,通过JavaScript...
本篇文章将探讨一种名为"表单验证框架"的技术,这种框架通常用于自动化和简化客户端及服务器端的表单验证过程。 在传统的Web开发中,表单验证往往需要开发者手动编写JavaScript代码来处理前端验证,同时还需要在...
HTML5客户端表单验证是现代Web开发中的一个重要特性,它允许开发者在用户提交表单之前在浏览器端进行数据验证,从而提高用户体验并减轻服务器负担。这个功能通过引入新的输入类型、属性以及内置验证机制得以实现。 ...
jsvalidation是一款轻量级的JavaScript验证框架,专为前端开发者设计,用于在客户端进行表单验证,确保用户输入的数据符合预设的规则和格式。这款框架能够有效地减少服务器端的负担,提高用户体验,因为它可以在用户...
**JSValidation验证框架详解*...综上所述,JSValidation验证框架是JSP开发中的得力工具,它通过简洁的API和强大的功能,极大地简化了前端验证的复杂度,提高了开发效率,为Web应用的用户体验和数据安全提供了有力保障。