我们为您推荐的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')); });
验证格式,为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之间。
验证时提示的名称,通常同label
名称相同。
验证时提示的内容区域的id,通常定义在span
或div
中。
验证重复密码是否同密码匹配,该属性应用于重复密码文本中,内容为制定密码文本的id
。
内容格式化属性,该属性仅当列类型为date
或number
时有效。
用于唯一验证的定义,脚本格式为:类别[|参数id]*。
例如:
user_add
:表示该唯一验证类别为user_add
,在验证服务器端该参数将被传递。
user_edit|user_id
:表示该唯一验证类别为user_edit
,且需要传递该form
中id
为user_id
元素中的内容,这样的设计主要用于编辑方面的保存,自己的原值重复不作考虑。
用于定义元素在验证过程中的css
,格式为:初始化样式|验证中样式|验证成功样式|验证失败样式
。
如果该只未定义,则该内容将为默认的option
中css
属性中的element
参数中定义的样式。
用于定义错误信息在验证过程中的css
,格式为:初始化样式|验证中样式|验证成功样式|验证失败样式
。
如果该只未定义,则该内容将为默认的option
中css
属性中的area
参数中定义的样式。
验证参数主要用于对表单验证全局属性的配置。
指定验证组件使用的语言,默认为zh-cn
简体中文。
可选参数:
en
:英文
zh-cn
:简体中文
zh-tw
:繁体中文
定义服务器唯一验证的url地址
。
定义自定义验证格式的参数,该参数定义完成之后需要在国际化文件中对应加入格式名称,用于提示。该参数的内容接受参数可以是一个正则表达式,或一个方法,方法返回的对象中包含两个参数:success
、message
。
success
:是否成功,成功为true,失败为false
message
:如果验证失败的提示信息,支持{validTitle}参数。
用于配置预置的样式内容,其中包含element元素
的样式、area验证区域
的显示信息区域的样式。
用于配置显示内容的前缀,目前是使用FontAwesome组件来完成,如果您有特殊需要,可以更改该属性,使用自己的图标库。
用于配置各个环节的验证组件后对元素的处理。
参数列表:
element
:元素对象
css
:样式内容,包含init
、validating
、success
、failure
四个样式。
本处理默认为bootstrap风格样式的元素处理。
对象方法可以通过实例化好的DLShouWen Validator对象
直接调用。
初始化方法,用于初始化验证内容、绑定方法。
方法名:init
参数:无
返回值:无
单体验证方法,该方法为内部验证方法,不建议单独调用。
方法名:singleValid
参数:
element
:需要验证的对象。
返回值:无
执行全部验证,该方法一般不需要调用。
方法名:valid
参数:无
返回值:无
获取验证结果。
方法名:validResult
参数:无
返回值:验证成功返回true,验证失败返回false
init方法的重载方法,同init方法相同。
静态方法为DLShouWen Validator制作过程中抽取出来的一些辅助方法,也可以公开使用,调用方式为:$.fn.dlshouwen.validator.tools.方法
。
提示方法。
方法名:toast
参数:
content
:提示内容
level
:提示级别,弱枚举类型,可选参数为:info
、warning
、error
、success
,默认值:info
time
:提示显示时间,单位为毫秒,整数类型(integer),默认值:3000
返回值:无
替换所有内容。
方法名:replaceAll
参数:
s
:原字符串
s
1:需要替换的字符
s2
:替换后的字符
返回值:经过替换后的字符串结果
获取内容长度。
方法名:length
参数:
s
:需要获取长度的字符串
返回值:字符串长度,其中中文字符按两个字节计算。
请参阅DLShouWen Validator提供的本地项目内容中的实现。