- 浏览: 143939 次
- 性别:
- 来自: 杭州
文章分类
最新评论
-
gadmyth:
beta reduction也介绍错了(λx . e)f →β ...
Lamda演算简介 -
gadmyth:
左结合法则是错的,因为Application binds mo ...
Lamda演算简介 -
hongmeikaile:
...
Struts2与ajax的组合 -
aguai0:
非常详细,学习了
prototype-1.3.1.js 开发笔记 -
左看右看:
...
DAO编程模式(转)
主要特征
- 简洁的验证语法
- 快速
- 无需编写验证提示信息
- 支持组合验证
- Ajax支持
- 基于prototype.js
- 无侵入性
- 支持国际化
- 易于扩展
- 基于标准的Html属性(class)添加验证,易于其它标准的jsp taglib集成
支持浏览器
- IE 5.x 以上
- Mozilla 1.4 以上
- FireFox 0.9 以上
- Opera 8.5 测试通过
helloworld示例
引用文件
<script src="prototype.js" type="text/javascript"></script> <script src="validation_cn.js" type="text/javascript"></script> <link rel="stylesheet" type="text/css" href="style_min.css"/>
- prototype.js是所有的基础
- validation_cn.js真正的验证框架文件
- 可以添加style_min.css中的样式声明,也可以把style_min.css中的样式声明引入到你的框架js文件中去.
表单验证
<!-- 为form增加required-validate class,标识需要验证form --> <form id='helloworld' action="#" class='required-validate'> helloworld:</br> <!--通过class添加验证: required表示不能为空,min-length-15表示最小长度为15 --> <textarea name='content' class='required min-length-15'></textarea></br> <input type='submit' value='Submit'/> <input type='reset' value='Reset'/> </form>
- 要是某个form中的元素被验证可以这样给声明的form中加一个class='required-validate'的属性,框架会在load是自动绑定所有要验证的域.
- 在要检查的域中通过class属性来声明被检查域的限制条件,例如上面的class='required min-length-15'表示这是一个非空,并且最小长度是15的域,在编辑域失去焦点时,会自动检查,如果输入不满足上述条件,则产生错误提示.
验证效果
检查规则
required | 非空域,全部空格也算空 | |
validate-number | 一个有效数 | |
validate-digits | 只能包含[0-9]任意个数字 | |
validate-alpha | 只能是字母[a-zA-Z] | |
validate-alphanum | 只能是字母和数字的组合 | |
validate-email | 只能是有效的email | |
validate-url | 只能是有效的url地址 | |
validate-one-required | 至少有一个被选中,例如一组checkbox, radiobutton,它们最好包含在一个div和span中 | |
validate-integer | 只能是整数,可以有正负号 | |
validate-ip | 有效的IP地址 | |
min-length-$number | 最小长度是$number (此处$some表示一个特定的值) | 最小长度为8: min-length-8 |
max-length-$number | 最大长度是$number | 最大长度为8: max-length-8 |
max-value-$number | 输入域的最大值是$number | 最大值为8.1: max-value-8.1 |
min-value-$number | 输入域的最小值是$number | 最大值为-8.1: max-value--8.1 |
equals-$otherInputId | 必须和某个input field相等,用于密码两次输入验证 | equals-password |
less-than-$otherInputId | 小于某个input field less-than-otherInputId,多用于结束日期不能小于开始日期的需求 | |
great-than-$otherInputId | 大于某个input field less-than-otherInputId | |
validate-date-$dateFormat | 只能是日期,$dateFormat为日期格式,$dateFormat的可选,默认格式为yyyy-MM-DD | validate-date-yyyy年MM月dd日 |
validate-file-$type1-$type2-$typeX | 验证文件输入域选择的文件类型只能为声明的$type1 – $typeX中的一种 | validate-file-png-jpeg |
float-range-$minValue-$maxValue | 必须是$minValue到$maxValue的一个浮点数 | 1至20: float-range-1-20 |
int-range-$minValue-$maxValue | 必须是$minValue到$maxValue的一个整数 | |
length-range-$minLength-$maxLength | 输入字符串的长度必须在$minLength到$maxLength之间 | |
validate-pattern-$RegExp | 通过自定义正则表达式$RegExp来验证输入域的正确性 | vaidate-pattern-/a/gi |
validate-ajax-$url | 通过ajax来验证输入域,$url为ajax验证提交的地址,错误提示信息将由服务器端返回. 数据示例 <input name="username" value="badqiu"/>
what为input的name,value为input的value |
validate-ajax-http://localhost/valiate-email.jsp |
validate-chinese | 只能是中文(以下为中国的相关验证) | |
validate-phone | 有效的电话 | |
validate-mobile-phone | 有效的手机号 | |
validate-id-number | 验证是否有效的身份证号码 | |
validate-zip | 验证邮政编码 | |
validate-qq | 验证QQ号码 |
编程式为表单增加验证(Validation选项)
- 可以手工指定要验证那个form,在指定是可以给定一些选项
<script type="text/javascript"> var valid = new Validation('form-id', {onSubmit:false}); // do something ... var result = valid.validate(); </script>
创建Valuedation是的参数说明
- onSubmit – 是否绑定onSubmit函数, default - true
- stopOnFirst – 是否在检查到第一个错误时就停止检查 default- false
- immediate – 是否在被检测域失去焦点时就检查被检查域 default - false
- focusOnError – 是否把焦点移动到发生错误的域上 default - true
- useTitles – 是否使用提示 default - false
- onFormValidate:当form被检测和的回调函数,有两个输入参数 arg[0]-检测form的结果true or false, arg[1]-form本身的id
- onElementValidate:当没个element被检查后的回调函数,有两个输入参数 arg[0]-检测form的结果true or false, arg[1]-element本身的id
添加自己的Validator测试函数
增加Validator
/*参数说明 * v: 为需要测试的值 * elm: 为html input * args: 为有参数的验证表达式传递的参数,如min-length-10,则args[0]为10 * metadata: 为Validator本身 */ Validation.add(['max-value',function(v,elm,args,metadata) { return parseFloat(v) <= parseFloat(args[0]); },{depends : ['validate-number']}], }); /* * 增加验证出错的提示信息 */ Validator.messagesSourceCn = [ ['max-value' , '最大值为%s'], ]
Validator的选项:
depends – 为validator的之间的内部依赖
ignoreEmptyValue – 表明validator是否忽略空值不进行测试
FAQs
- 我的网站现在使用的是UTF-8编码,怎么使用validation_cn.js显示中文会乱码?
答:validation_cn.js默认是使用GBK编码,使用可以改变文件编码的编辑器以UTF-8编码方式再保存,如保存为validation_cn_UTF-8.js - 国际化怎么办?
答:动态修改Validator.messageSource即可 - 日期之间的比较怎么办,如结束日期要大于开始日期
答:先使用validate-date验证输入的值是合法的日期,再加上"less-than"的比较即可 - select的验证
答:将Please Select..的值使用一个空格填充即可<select id="test" name="test" class="required"> <option value=" ">Please Select..</option> <option value="val1">Value 1</option> <option value="val2">Value 2</option> </select>
- 在IE中提示"Unterminated string constant"或是"末结束的字符串常量"错误
答: 是由于你网页的编码问题,validation_cn.js默认是GBK编码,请转换成与你的网页想适应的编码
发表评论
-
ajax的url编码问题
2007-06-29 18:51 1925在进行ajax的post数据提交时,中文的c处理方式是urle ... -
Javascript变换表格内容
2007-06-06 11:05 1590[code<script language=" ... -
struts ajax
2007-05-25 20:23 1406转贴请保留作者--简单就好,和出处。谢谢! 去年初,正好负责 ... -
Prototype使用指南之string.js
2007-05-24 11:10 1350Prototype使用指南之string.js2007-05- ... -
如何设置RESIN服务器能让用户直接下载csv文件
2007-04-19 16:08 2424<mime-mapping> <extens ... -
JS一些技巧收藏
2007-03-28 12:01 1167事件源对象 event.srcEleme ... -
js变量作用域及可访问性的探讨
2007-03-27 15:43 1465每一种语言都有变量的概念,变量是用来存储信息的一个元素。比如 ... -
JSON,JavaScript Object Notiation
2007-03-22 08:51 1300Ajax(Asynchronous JavaScript an ... -
面向 Java 开发人员的 Ajax: 结合 Direct Web Remoting 使用 Ajax
2007-03-21 16:11 1035虽然令人兴奋,但是把 ... -
介绍 JSON
2007-03-21 15:48 1188JSON(JavaScript Object Notation ... -
基于prototype.js验证框架(validation.js)的三个应用
2007-03-16 14:32 2524基于prototype.js验证框架(validation. ... -
prototype-1.4.0注释版本
2007-03-01 16:57 1680/* Prototype JavaScript framew ... -
prototype-1.3.1.js 开发笔记
2007-02-28 17:03 23781. Prototype是什么? ... -
AJAX开发简略 (第一部分)
2007-02-12 16:06 1189在使用浏览器浏览网页 ... -
AJAX开发简略 (第二部分)
2007-02-12 16:04 977AJAX开发简略 (第二部分) ... -
AJAX框架之DOJO
2007-02-12 15:36 1897AJAX ...
相关推荐
"强大的表单验证框架"标题所指的,很可能是用于简化这一过程的高效工具,旨在帮助开发者更方便、更有效地进行表单数据验证。 表单验证框架通常包含以下核心功能: 1. **规则定义**:提供丰富的验证规则,如非空、...
标题“最简单的表单验证框架发布”提示我们讨论的主题是一个用于验证HTML表单的轻量级框架。在网页开发中,表单验证是确保用户输入数据有效性和安全性的关键步骤。这个框架可能简化了常见的验证规则,使得开发者可以...
jQuery formValidator表单验证插件,它是基于jQuery类库,实现了js脚本于页面html代码的分离。你可以划分多个校验组,每个组的校验都是互不影响。对一个表单对象,你只需要写一行代码就可以轻松实现无数种(理论上)...
formvalidator 是一个强大的前端表单验证框架,专为开发者提供高效、灵活的表单数据验证解决方案。这个框架允许开发者在用户提交表单前检查输入的数据,确保数据的完整性和准确性,从而提高用户体验并减少服务器端的...
如首页所说,JSValidation是客户端表单验证框架,用在BS系统中,或者简单的网页系统中。表单验证在这些开发中很常见:新用户注册,需要校验某些字段;用户登陆,需要校验;等等。在这之前,页面开发者...
"表单验证框架"就是一种专门用于简化这一过程的工具,它提供了便捷的方式来验证用户在网页表单中填写的信息。 首先,我们要理解表单验证的重要性。在网页应用中,用户输入的数据经常需要被处理或存储,例如注册账号...
Java表单验证框架是开发Web应用时不可或缺的一部分,它能够帮助开发者轻松地对用户输入的数据进行有效性检查,确保数据的准确性和安全性。本框架以简洁、高效为特点,通过在表单字段上添加正则表达式标签,即可实现...
传统的验证方式往往需要编写大量的JavaScript代码,而这套框架通过提供配置文件和特定的标签使用,使得表单验证变得更加简单易行。 在使用**JS客户端表单验证框架**时,开发者不再需要手动编写复杂的JavaScript函数...
标题中的“自定义表单验证框架”指的是一个用于在Web应用程序中验证用户输入的自定义工具。这样的框架允许开发者根据业务需求制定特定的验证规则,提高应用的安全性和用户体验。表单验证是确保用户提交的数据符合...
**JSP客户端表单验证框架JSValidation** JSValidation是一款基于JavaScript的轻量级表单验证框架,主要用于在JSP(JavaServer Pages)应用中实现客户端的表单数据验证。它提供了一种简单、高效的手段来确保用户在...
本部分将深入讲解如何在B/S架构的应用程序中实施一个简单的表单验证框架,以登录表单为例。 首先,登录表单通常由HTML构成,如示例中的`login.jsp`文件所示。这段代码中包含了HTML的基本结构,包括定义文档类型(`...
**标题解析:** "简单且强大的js表单验证框架" 这个标题表明我们要讨论的是一种JavaScript(js)实现的轻量级表单验证工具。它强调了易用性和功能的强大性,暗示这个框架可能提供了丰富的验证规则和灵活的自定义选项...
《jQuery表单验证框架——深入理解jQuery.validate》 在网页开发中,表单验证是必不可少的一环,它能确保用户输入的数据符合预期,减少服务器端的处理负担,提高用户体验。jQuery是一个广泛使用的JavaScript库,而...
表单验证框架验证是提高这一过程效率和用户体验的有效手段。本文将详细探讨三种常见的表单验证方法:JavaScript验证、框架验证以及正则表达式验证。 首先,我们来了解**JavaScript验证**。JavaScript是一种客户端...
sui表单验证框架是一款强大的JavaScript开发工具,专用于实现高效、灵活的表单验证功能。在Web应用中,表单验证是不可或缺的一部分,它确保用户输入的数据符合预设的规则,从而提高数据质量和用户体验。sui框架凭借...
一个最简单的SSH框架Struts 、 spring 、 Hibernate 在各层的作用 1 ) struts 负责 web 层 . ActionFormBean 接收网页中表单提交的数据,然后通过 Action 进行处理,再 Forward 到对应的网页。 在 struts-config...
1. **表单验证**:在Web应用中,EasyValidation 3.0 可用于验证用户提交的表单数据,确保数据的完整性和合法性。 2. **数据库操作**:在保存或更新数据前,使用EasyValidation 3.0 验证数据,避免无效数据入库。 3...
在网站开发中,Ajax(Asynchronous JavaScript and XML)表单验证框架是提高用户体验的重要工具。它允许我们在不刷新整个页面的情况下进行数据验证,为用户提供实时反馈,极大地提升了交互性。本教程将深入探讨Ajax...