标题：vtor
概述
vtor 是一个全新的解耦合页面验证js框[1]架。根据全新的VVC思想(validator-view-controler). 基于配置，使验证与页面分离，更加方便、高效。Vtor 验证库包含了25种以上的常用验证。用户可以自定义添加或覆盖已有的验证函数库；用户可以自定义配置文件组织格式。  vvc思想结构
用法
2.1引入框架<script src='js/jquery.js'> </script><script src='../jquery.vtor.js'> </script>2.2添加ID属性例：对中文验证中文名：<input type='text' id='chineseName' value=''/>2.3验证部件例：在验证文件demo.vtor中,配置对中文名验证>必填、中文、2-4个字符的 @demo#chineseName--notNull()::<spanstyle='color:red;'>*</span>必填--chinese()::请输入中文--len(2,4)::请输入2-4个字验证文件格式说明：注释方式：多行注释/* */单行注释://@view //页面模块名以@开头；可以有多个#DOM VID //页面上DOM VID以#开头；可以有多个--functionName([param])::message //--验证函数类型(参数)::提示/*验证语--开头；::后表示验证错误提示信息；无参数时()可省略不写；可以复合验证；既一个DOM可以有多个验证语句；可以有多个。*/2.4执行验证<script> $(function(){$vtor.$({ //初始化；参数1：验证文件路径；参数2：页面模块名 path:'vtor.vtor',//验证文件路径 view:'model1',//使用的页面模块名 auto:true,//是否自动验证 autoFunc:'change'//自动验证的函数名（取自jquery bind里的第一个参数,默认keyup） });  $("#submitButton").click(function(){ var r=$vtor.$v();//执行验证 if(r){//r是返回的验证结果 $( ‘form’).submit() } });}) </script>2.5验证结果以下是验证结果的截图：
  必填
  输入中文
  输入2-4个字
  正确
自定义配置
3.1概述用户可以通过在vconf/vtor.config.js文件中自定义修改验证文件组织格式、扩充或覆盖验证函数库。相关参数配置项如下表：
参数名
参数说明
默认
func_pre
验证函数前缀
func
view_pre
页面模块前缀
@
id_pre
DOM ID前缀
#
validateTerm_pre
验证语句前缀
--
msg_pre
验证提示信息前缀
::
param_begin
验证函数参数开始字符
(
param_end
验证函数参数结束字符
)
param_split
验证函数参数分隔字符
,
msg_type
提示类型：single,multiple
single
errMsg_class
提示框错误的样式
vtor-input-err-msg
errInput_class
输入框错误的样式
vtor-input-err-border
okMsg_class
提示框正确的样式
vtor-input-ok-msg
okInput_class
输入框正确的样式
vtor-input-ok-border
vtor_suf
验证文件扩展名配置
vtor
configMethod获取vtor配置文件的方式postshow 消息框显示的动作​bind聚焦输入框时的动作​* configMethod 获取vtor配置文件的方式；一般有两种方式：get,post;默认post　* show 消息框显示的动作:function(vid,msg,result){//这里写你的自定义代码；vid是输入框的jQuery对象，msg是错误提示框的jQuery对象;result表示验证结果};默认function(vid,msg,result){msg.show(500);}　* bind 初始化验证组件完毕时执行的函数:function(vid,msg){//这里写你的自定义代码；vid是输入框的jQuery对象，msg是错误提示框的jQuery对象;}默认function(vid,msg){}　*msg_type提示类型：single只提示第一个错误信息,multiple提示全部错误信息　*以上参数均区分大小写　需要引入js：<script src='../vconf/vtor.config.js'> </script>3.2组织格式自定义验证文件的代码： custom.vtor={　view_pre:'#?'//配置文件中验证模块用@?标识　id_pre:'#?'//配置文件中VID用#?标识　validateTerm_pre:’-?’//配置文件中验证语句用-?标识　}　配置文件就可以这样配置：　@?view //页面模块名以@?开头；可以有多个　#?domVId //页面上DOM VID以#?开头；　-?functionName([param])::message //验证语句以-?开头3.3验证函数库用户自定义函数的代码(有参数、无参数两个实例)：　custom.funcs={func_numeric:function(id){//只能输入数字（无参数）[2]　var val=$vtor.$id(id);//获取dom vid的输入值 return /^\d+$/.test(val);}[2]func_numericLimit:function(id,param){//只能输入限定位数的数字（有参数）　var val=$vtor.$id(id);//获取dom vid的输入值　if(val.length!=param[0]){return false;} return /^\d+$/.test(val); }}　定义好以上两个函数，用户就可以在vtor配置文件中配置使用了@demo#inum-- numeric()::请输入数字//无参也可以：-- numeric::请输入数字-- numericLimit(4)::请输入4位数字　例：函数格式= <func_pre><_><functionName>:function(<vid>[,param]){[functionBody]};既：函数格式=验证函数前缀[默认func]+下划线+函数功能名称:function(DOM VID[,参数]){[方法体]}[2]3.4样式自定义样式有两种方式：　1. 直接修改css/vtor.css文件中的两个样式的内容　2.在vconf/vtor.config.js中配置相关css类名　第一种就不说了。我们说第二种：　首先自己写好样式：demo.css　eb是错误框的样式，em是错误消息的样式　.eb{border:1px solid #555}　.em{border:1px solid #555;background:#ddd;padding:5px;margin-left:5px;　color:blue;max-width:180px;min-width:50px;　}　然后在config.js中配置相关信息　custom.vtor={　msg_class:'em',//配置错误消息样式　errInput_class:'eb'//配置错误框样式　}　最后在html中引入css样式文件（也可以直接写在style块中。总之能加载到两个css类就可以）　<link rel='stylesheet' href='demo.css'/>3.5消息事件比如：现在我需要消息出现与消失的效果是淡入淡出　可以这样配置：　custom.vtor={　show:function(msg){　msg.fadeIn(500);//淡入　} , bind:function(vid,msg){ vid.focus(function(){ msg.fadeOut(500);//淡出 }) ;　}　}　这样消息的显示与隐藏就有了淡入淡出的效果了！