表单验证form.js驱动模块的应用

$(document).ready(function(){
var modifyInfo = {
formElements:[
{
name:'email',//验证文本框的data-role
rules:[
{
rule:empty,//采用非空验证
law:'',//验证规则，因是非空验证故此处为空，但该参数必须写
tipw:'<div class=error data-role=emailpoint>邮箱不能为空</div>',//非空验证错误的提示内容。注：此处的data-role组成为'本文本框的data-role'+'point'
tipr:'<div class=error data-role=emailpoint>正确1</div>'//非空验证正确的提示内容。
},{
rule:regular,//正则验证
law:/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/,
tipw:'<div class=error data-role=emailpoint>邮箱格式不正确,请检查</div>',
tipr:'<div class=error data-role=emailpoint>正确2</div>'
},{
rule:ajaxs,//ajax验证
io:'/form/post.php'//验证与后台交互的地址
}
],
errors:[{
error_float_top : 2,//本文本框验证结果提示摆放的位置。桩模块已计算出本文本框top值，此处的数值为提示相对于文本框top相加的偏移量
error_float_left : 10//本文本框验证结果提示摆放的位置。相对于本文本框右侧边的偏移量
}]
},{
name:'password',
rules:[
{
rule:empty,
law:'',
tipw:'<div class=error data-role=passwordpoint>密码不能为空</div>',
tipr:'<div class=error data-role=passwordpoint>正确</div>'
},{

rule:restriction,//字数限制验证
law:[3,21,'cn'],//3为最小字数；21为最大字数；'cn'为判断的方式，cn：中英文都算一个字符，en：中文两个字符英文一个字符
tipw:'<div class=error data-role=passwordpoint>密码在3-21之内</div>',
tipr:'<div class=error data-role=passwordpoint>正确</div>'
},{
rule:regular,
law:/^[A-Za-z\\d\\u4E00-\\u9FA5]+$/,
tipw:'<div class=error data-role=passwordpoint>昵称不能含有特殊字符</div>',
tipr:'<div class=error data-role=passwordpoint>正确</div>'
}
],
errors:[{
error_float_top : 2,
error_float_left : 10
}]
},{
name:'confirmpassword',
rules:[
{
rule:confirm,//验证两个文本框值是否相同。
law:['password','value'],//'password'：需要验证标签的data-role；'value'：需要验证标签的取值点
tipw:'<div class=error data-role=confirmpasswordpoint>两次密码输入不一致</div>',
tipr:'<div class=error data-role=confirmpasswordpoint>正确</div>'
}
],
errors:[{
error_float_top : 2,
error_float_left : 10
}]
},{
name:'textarea',
rules:[
{
rule:empty,
law:'',
tipw:'<div class=error data-role=textareapoint>内容不能为空</div>',
tipr:'<div class=error data-role=textareapoint>正确</div>'
},{
rule:restriction,
law:[0,140,'en'],
tipw:'<div class=error data-role=textareapoint>文字最多输入140个字</div>',
tipr:'<div class=error data-role=textareapoint>正确</div>'
}
],
errors:[{
error_float_top : 2,
error_float_left : 10
}]
},
{
name:'Vemail',//第二个表单的email验证
rules:[
{
rule:empty,
law:'',
tipw:'<div class=error data-role=Vemailpoint>邮箱不能为空<div>',
tipr:'<div class=error data-role=Vemailpoint>正确</div>'
},{
rule:regular,
law:/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/,
tipw:'<div class=error data-role=Vemailpoint>邮箱格式不正确,请检查</div>',
tipr:'<div class=error data-role=Vemailpoint>正确</div>'
}
],
errors:[{
error_float_top : 2,
error_float_left : 10
}]
}
],
submitAction:[
{
name:'form01',//第一个form的data-role
submitFunction:function(form){//第一个form验证结束后运行的function
$('body').css('background','#008800');
}
},{
name:'form02',
submitFunction:''//第二个form验证结束后运行的function。如果不需要另行执行其他动作，则表单会在验证全部正确的情况下提交表单
}
]
};

//程序触发
trigger(modifyInfo);
});