jquery-Lweight-validate 作者:大猫 http://vikenlove.github.io/jquery-Lweight-validate 开源轻量级校验框架:更新信息与BUG修复记录请查看issueList文件
如何使用:
$('#form').myValidate(options)
例:
$('#form').myValidate(
{
formCall:function(data){formCallFunction(data);},
isAlert:false,
formKey:false,
errorCustom:{customFlag:true,regionText:false},
errorStyle:{errorRegion:"error-div",errorClass:"textError",rightClass:"right-item"},
alterCall:function(msg){callbackFunction(msg);}
});
});
注:options 同校验属性-other config,所有要校验的属性都需要在form标签内, 表单提交按钮:btn-type="true" 需要配置
校验属性-check-type规则:
required:非空校验 unRequired:非必填项属性 number:校验数字 mail:校验Email char:英文字符校验 chinese:中文字符校验 mobile:手机号码校验 tell:电话号码-格式支持:+(国家代码)-(区号)-号码-(分机号) passWord:密码强度校验-默认长度大小6~20 confirmPwd:密码确认 dateYmd:日期格式-例:yyyy-MM-dd idCard:身份证号码 dateCompare:前后日起大小-例:起始日期-结束日期 之间比较 username:只能注册非中文用户名
校验属性-other config:
non-required: check-type规则下 非填写情况下不校验配置
required-message:自定义提示信息
min-max:文本长度校验-例:min-max="1-10" 最小长度为1,最大长度10
min-message:最小长度提示信息
max-message:最大长度提示信息
data-callback:文本异步校验回调函数
call-message:异步回调自定义信息
options:
formCall:表单提交函数(*必配选项*)
isAlert:是否开启alert弹出方式,true/false 不配置,则等于为false(非必配选项)
formKey: 是否开启回车键监听,true/false 不配置,则等于为false(非必配选项)
alterCall:alert 弹出方式自定义回调函数,此方法用于自定义的
alert效果 function(msg){callbackFunction(msg);} (非必配选项)
增加
errorCustom:{customFlag :true,regionText:false},
增加自定义属性:
customFlag :true 为自定义错误校验信息显示位置,
regionText:true 错误信息显示在文本框内效果
errorStyle:{errorRegion:"error-div",errorClass:"textError",rightClass:"right-item"},
错误信息样式 自定义
errorRegion:样式DIV 显示位置。
errorClass:错误样式样式表值
rightClass:正确显示样式表
============== HMTL DEMO:
<form id="form">
//当文本输入值后,校验其类型,不填则不进行校验
<div class="control-group">
<label class="control-label" for="inputtext">数字</label>
<div class="controls">
<input type="text" id="inputtext" check-type="number" non-required='true'>
</div>
</div>
//文本异步调用校验配置
<div class="control-group">
<label class="control-label" for="inputName">用户名</label>
<div class="controls">
<input type="text" id="inputName" check-type="required"
data-callback="mycallback()" call-message="用户名名已存在"
required-message="用户名不能为空">
</div>
</div>
//非特定规则校验下,当输入后校验,不输入不进行校验配置
<div class="control-group">
<label class="control-label" for="inputtext">文本</label>
<div class="controls">
<input type="text" id="inputtext" check-type="unRequired"
min-max="3-5" min-message="字符长度不得小于3个字符"
max-message="字符长度不得超过5个字符"
required-message="文本不能为空!" >
</div>
</div>
</form>