引入文件

环境在 jQuery 下 , 所有先要引入 jQuery 

1 <%--校验样式--%>2 
     3 <%--校验及自定义规则规则--%>4 

链接： 密码：5lw3 

已经添加部分自定义校验

 

使用 两种方式:

1 普通校验2 3 4 自定义校验5 

 

 

初始化 参数调用:

1  　　$("#form").validationEngine('attach', {2             relative: true,3             overflownDIV: "#divPostion",4             isOverflown:true, 　　　　　　　　overflownDIV: $('#divPostion'), 　　　　　　　　autoHidePrompt:true, 　　　　　　　　autoHideDelay: 5000, // 显示时间 5             promptPosition: "topLeft" // 验证弹出框的位置，topRight,topLeft,bottomRight,bottomLeft,centerRight,centerLeft,inline6         });

 

初始化 直接调用:

1 // 直接调用2 $('#form').validationEngine();

 

取消校验 :

// 取消校验$("#form").validationEngine("detach");

 

 

 

验证类型说明 

名称	示例	说明
required	validate[required]	表示必填项
groupRequired[string]	validate[groupRequired[grp]]	在验证组为 grp 的群组，中至少输入或选择一项
condRequired[string]	validate[condRequired[ids]]	当 ids 的某个控件不为空时，那么该控件也为必填项。 可以依赖多项，如：validate[condRequired[id1,id2]]
minSize[int]	validate[minSize[6]]	最少输入字符数
maxSize[int]	validate[maxSize[20]]	最多输入字符数
min[int]	validate[min[1]]	最小值（该项为数字的最小值，注意与 minSize 的区分）
max[int]	validate[max[9999]]	最大值（该项为数字的最大值，注意与 maxSize 的区分）
minCheckbox[int]	validate[minCheckbox[2]]	最少选取的项目数（用于 Checkbox）
maxCheckbox[int]	validate[maxCheckbox[2]]	最多选取的项目数（用于 Checkbox）
date[string]	validate[custom[date]]	验证日期，格式为 YYYY/MM/DD、YYYY/M/D、YYYY-MM-DD、YYYY-M-D
dateFormat[string]	validate[custom[dateFormat]]	验证日期格式，格式为 YYYY/MM/DD、YYYY/M/D、YYYY-MM-DD、YYYY-M-D
dateTimeFormat[string]	validate[custom[dateTimeFormat]]	验证日期及时间格式，格式为：YYYY/MM/DD hh:mm:ss AM|PM
dateRange[string]	validate[dateRange[grp1]]	验证 grp1 的值是否符合日期范围（开始日期与结束日期） 根据控件的前后位置，如果当前控件在 grp1 元素之后，输入的日期不能是 grp1 日期的过去。 如果当前控件在 grp1 控件之前，输入的日期不能是 grp1 日期的未来。
dateTimeRange[string]	validate[dateTimeRange[grp1]]	验证日期及时间范围，增加了时间的对比，其他的和 dateRange 一样。
past[string]	validate[past[2012/12/20]]	日期必需是 date 或 date 的过去。date 格式可写作 YYYY/MM/DD、YYYY/M/D、YYYY-MM-DD、YYYY-M-D 或 now
future[string]	validate[future[now]]	日期必须是 data 或 date 的未来。date 格式可写作 YYYY/MM/DD、YYYY/M/D、YYYY-MM-DD、YYYY-M-D 或 now
equals[string]	validate[equals[id]]	当前控件的值需与控件 id 的值相同
number	validate[custom[number]]	验证数字
integer	validate[custom[integer]]	验证整数
phone	validate[custom[phone]]	验证电话号码
email	validate[custom[email]]	验证 E-mail 地址
url	validate[custom[url]]	验证 url 地址，需以 http://、https:// 或 ftp:// 开头
ipv4	validate[custom[ipv4]]	验证 ipv4 地址
onlyNumberSp	validate[custom[onlyNumberSp]]	只接受填数字和空格
onlyLetterSp	validate[custom[onlyLetterSp]]	只接受填英文字母、单引号（'）和空格
onlyLetterNumber	validate[custom[onlyLetterNumber]]	只接受数字和英文字母
custom[自定义规则]	validate[custom[ruleName]]	自定义规则验证 'ruleName': { 'regex': RegExp, /* 正则表达式，如果正则能匹配内容表示通过 */ 'alertText': '验证不通过时的提示信息' }
ajax	validate[ajax[ajaxName]]	自定义 ajax 验证 'ajaxName': { 'url': "<%=basePath%>systemParam/ajaxVerify.action", /* 验证程序地址 */ 'extraData': 'name=eric', /* 额外参数 */ 'alertTextOk': '验证通过时的提示信息', 'alertText': '验证不通过时的提示信息', 'alertTextLoad': '正在验证时的提示信息' } /* * 例： * <input type="text" id="email" class="validate[ajax[ajaxName]]"> * 假设填写的值为：study4Java.com * extraData 设置为：'type=register' * 提交到后端的 url 为：<%=basePath%>systemParam/ajaxVerify.action?fieldId=email&fieldValue=study4Java.com&type=register */ 传输方式：get 传递参数："fieldId=" + field.attr("id") + "&fieldValue=" + field.val() 额外参数：extraData 可以设置为字符串或对象，会在参数结尾追加 "&extraData" 返回数据格式：数组 返回数据内容：[String,Boolean,String] 第一个值类型为 String，是接收到 fieldId 的值； 第二个值类型为 Boolean，验证通过返回 true，不通过返回 false 第三个值类型为 String，是弹出的提示信息,为空则显示声明时的信息； 具体请参考
funcCall	validate[funcCall[functionName]]	调用外部函数验证 functionName(field, rules, i, options)

 

 

参数说明:

 

 

 

名称	默认值	说明
validationEventTrigger	'blur'	触发验证的事件，支持事件可参考 jQuery 的事件说明。 PS：如果希望只在表单提交时验证，可以设置为空。或者设置参数 binded:false
binded	true	是否绑定即时验证
scroll	true	屏幕自动滚动到第一个验证不通过的位置。
focusFirstField	true	验证未通过时，是否给第一个不通过的控件获取焦点。
validateNonVisibleFields	false	是否验证不可见的元素（如 type="hidden" 的输入框，或多个输入控件在选项卡切换中）
showPrompts	true	是否显示提示信息
showArrow	true	是否显示提示信息的箭头
promptPosition	'topRight'	提示信息的位置，可设置为：'topRight', 'topLeft', 'bottomRight', 'bottomLeft', 'centerRight', 'centerLeft', 'inline' 可设置更具体的位置，格式为："方向: X偏移值, Y偏移值"。如：bottomLeft: -20, 5
autoPositionUpdate	false	是否自动调整提示层的位置
autoHidePrompt	false	是否自动隐藏提示信息
autoHideDelay	100000	自动隐藏提示信息的延迟时间 (ms)
fadeDuration	0.3	隐藏提示信息淡出的时间
addPromptClass	''	给提示信息增加 class Ciaoca 增强版中，增加样式如下： 'formError-noArrow' -- 无箭头样式 'formError-text' -- 纯文字样式 'formError-small' -- 精简版样式 'formError-white' -- 白色版样式 可以叠加使用，如：addPromptClass: 'formError-noArrow formError-small'
custom_error_messages	{}	自定义错误信息内容
maxErrorsPerField	false	单个元素显示错误提示的最大数量，值设为数值。默认 false 表示不限制。
showOneMessage	false	是否只显示一个提示信息
doNotShowAllErrosOnSubmit	false	在提交表单时不显示所有的错误信息（建议使用参数 showOneMessage 替代）
addSuccessCssClassToField	''	验证通过时，给控件增加 class，当再次验证失败时，会去除。
addFailureCssClassToField	''	验证失败时，给控件增加 class，当再次验证通过时，会去除。
prettySelect	false	是否使用了美化过的 select 选择控件
onFieldSuccess	false	控件验证通过时的回调函数 function(field){}
onFieldFailure	false	控件验证失败时的回调函数 function(field){}
onSuccess	false	在表单验证结果为通过时的回调函数
onFailure	false	在表单验证结果为失败时的回调函数 PS：onSuccess 和 onFailure 请参考
onValidationComplete	false	表单提交验证完成时的回调函数  function(form, valid){}，参数： form：表单元素 valid：验证结果（ture or false） PS：使用此方法后，表单即使验证通过也不会进行提交，交给定义的回调函数进行操作。
ajaxFormValidation	false	是否使用 Ajax 提交表单（默认使用 GET 方式发送数据）
ajaxFormValidationURL	false	设置 Ajax 提交的 URL，默认使用 form 的 action 属性
ajaxFormValidationMethod	'get'	设置 Ajax 提交时，发送数据的方式
onAjaxFormComplete	$.noop	表单提交，Ajax 验证完成后的行为（Function） function(status, form, json, options){}
onBeforeAjaxFormValidation	$.noop	表单提交验证通过后，Ajax 提交之前的回调函数  function(form, options){}
ajaxValidCache	{}
isError	false
InvalidFields	[]
isOverflown	false	表单是否在溢出滚动的元素内（即外部元素设置了 overflow:scroll） PS：设置为 ture 后，提示内容的插入位置将更改为在验证的控件之前插入； 　　此时需要在控件外层再套一个元素，并设置 class="inputContainer"
overflownDIV	''	设置了溢出滚动的元素，格式为 jQuery 的选择器。
usePrefix	''	使用 ID 前缀
useSuffix	''	使用 ID 后缀
validateAttribute	'class'	存放验证规则的属性
bindMethod	'bind'
inlineAjax	false