部署

基础文件引入

我们为您推荐的javascript文件和css文件的引用顺序如下:

<!-- jQuery -->
<script type="text/javascript" src="../dependents/jquery/jquery.min.js"></script>
<!-- font-awesome -->
<link rel="stylesheet" type="text/css" href="../dependents/fontAwesome/css/font-awesome.min.css" media="all" />
<!-- DLShouWen Validator -->
<script type="text/javascript" src="../dlshouwen.validator.js"></script>
<script type="text/javascript" src="../i18n/en.js"></script>
<script type="text/javascript" src="../i18n/zh-cn.js"></script>
<script type="text/javascript" src="../i18n/zh-tw.js"></script>
<link rel="stylesheet" type="text/css" href="../dlshouwen.validator.css" />
<!-- datePicker -->
<script type="text/javascript" src="../dependents/datePicker/WdatePicker.js" defer="defer"></script>
<link rel="stylesheet" type="text/css" href="../dependents/datePicker/skin/WdatePicker.css" />
<link rel="stylesheet" type="text/css" href="../dependents/datePicker/skin/default/datepicker.css" />
语言文件引入

将i18n文件夹中您所需要的语言文件引入到dlshouwen.validator.js文件下方即可。

<script type="text/javascript" src="../i18n/en.js"></script>
对象实例化

您可以使用如下代码对DLShouWen Validator对象进行对象实例化,实例化后的对象将支持众多方法,具体的实例化参数及相关方法请查阅后续参考文档。

var validator;
$(function(){
	validator = $.fn.dlshouwen.validator.init($('#testForm'));
});
验证属性

valid

验证格式,为DLShouWen Validator组件中最重要的属性,该属性中需要您定义验证的脚本,多级验证脚本使用|分隔符进行分割。脚本支持的内容如下:

r:必填、必选

l:长度标识

m:大小标识

e:包含等于

-:范围标识

email:邮箱验证

phone:电话号码验证,主要应用于座机

english_number:英文或数字组合验证

mobile:手机号码验证

url:超链接验证

money:金额验证

number:数值格式验证,类似正整数,但可以加前缀0,比如0039283也是合法的

zip:邮政编码验证

qq:QQ号码验证

integer:整数验证

double:浮点数验证

english:英文字符验证

chinese:中文字符验证

card:身份证验证

例如:

r|english|l6-le20:表示该内容必须填写,且必须为英文格式,而且长度必须在大于6且小于等于20之间。

r|double|me200-me2000:表示该内容必须填写,且必须为浮点类型格式,而且大小必须在大于等于200且小于等于2000之间。

validTitle

验证时提示的名称,通常同label名称相同。

validInfoArea

验证时提示的内容区域的id,通常定义在spandiv中。

validPassword

验证重复密码是否同密码匹配,该属性应用于重复密码文本中,内容为制定密码文本的id

内容格式化属性,该属性仅当列类型为datenumber时有效。

validUnique

用于唯一验证的定义,脚本格式为:类别[|参数id]*。

例如:

user_add:表示该唯一验证类别为user_add,在验证服务器端该参数将被传递。

user_edit|user_id:表示该唯一验证类别为user_edit,且需要传递该formiduser_id元素中的内容,这样的设计主要用于编辑方面的保存,自己的原值重复不作考虑。

validElementCss

用于定义元素在验证过程中的css,格式为:初始化样式|验证中样式|验证成功样式|验证失败样式

如果该只未定义,则该内容将为默认的optioncss属性中的element参数中定义的样式。

validInfoAreaCss

用于定义错误信息在验证过程中的css,格式为:初始化样式|验证中样式|验证成功样式|验证失败样式

如果该只未定义,则该内容将为默认的optioncss属性中的area参数中定义的样式。

验证参数

验证参数主要用于对表单验证全局属性的配置。

lang

指定验证组件使用的语言,默认为zh-cn简体中文。

可选参数:

en:英文

zh-cn:简体中文

zh-tw:繁体中文

unique

定义服务器唯一验证的url地址

validType

定义自定义验证格式的参数,该参数定义完成之后需要在国际化文件中对应加入格式名称,用于提示。该参数的内容接受参数可以是一个正则表达式,或一个方法,方法返回的对象中包含两个参数:successmessage

success:是否成功,成功为true,失败为false

message:如果验证失败的提示信息,支持{validTitle}参数。

css

用于配置预置的样式内容,其中包含element元素的样式、area验证区域的显示信息区域的样式。

icon

用于配置显示内容的前缀,目前是使用FontAwesome组件来完成,如果您有特殊需要,可以更改该属性,使用自己的图标库。

elementCallback

用于配置各个环节的验证组件后对元素的处理。

参数列表:

element:元素对象

css:样式内容,包含initvalidatingsuccessfailure四个样式。

本处理默认为bootstrap风格样式的元素处理。

对象方法

对象方法可以通过实例化好的DLShouWen Validator对象直接调用。

init

初始化方法,用于初始化验证内容、绑定方法。

方法名:init

参数:无

返回值:无

singleValid

单体验证方法,该方法为内部验证方法,不建议单独调用。

方法名:singleValid

参数:

element:需要验证的对象。

返回值:无

valid

执行全部验证,该方法一般不需要调用。

方法名:valid

参数:无

返回值:无

validResult

获取验证结果。

方法名:validResult

参数:无

返回值:验证成功返回true,验证失败返回false

reset

init方法的重载方法,同init方法相同。

静态方法

静态方法为DLShouWen Validator制作过程中抽取出来的一些辅助方法,也可以公开使用,调用方式为:$.fn.dlshouwen.validator.tools.方法

toast

提示方法。

方法名:toast

参数:

content:提示内容

level:提示级别,弱枚举类型,可选参数为:infowarningerrorsuccess,默认值:info

time:提示显示时间,单位为毫秒,整数类型(integer),默认值:3000

返回值:无

replaceAll

替换所有内容。

方法名:replaceAll

参数:

s:原字符串

s1:需要替换的字符

s2:替换后的字符

返回值:经过替换后的字符串结果

length

获取内容长度。

方法名:length

参数:

s:需要获取长度的字符串

返回值:字符串长度,其中中文字符按两个字节计算。

高级功能

唯一验证的封装

请参阅DLShouWen Validator提供的本地项目内容中的实现。