1. $.form.group(grp, action, powForm)
说明:
表单分组接口,必须。
参数:
1)参数grp,值范围[…-2,-1,0,1,2…true],整数或true
grp = true表示非正常表单(无<form>标签包裹的表单域,下文将不作说明)
grp = -1 表示最后一个表单,依此类推-2为倒数第二个表单
grp = 0 表示第一个表单,grp = 1表示第二个表单,依此类推
2)参数action,值范围[INSERT, INSERTONE, DELETE, RESET],可省略,主要用于动态添加、删除表单(对应DOM结点新增、删除表单)
action = INSERT 表示在指定表单前插入一个表单
action = INSERTONE 表示在指定表单前仅可插入一个表单
action = DELETE 表示删除一个表单
action = RESET 表示重置表单,将表单数组恢复至默认状态
3)参数powForm,当powForm = true表示非正常表单
使用:
// 按页面表单顺序自动绑定监听,将页面正常表单进行索引分组
$.form.group();
// 按页面表单顺序自动绑定监听,自动将页面非正常表单进行索引分组
$.form.group(true);
// 绑定监听页面第一个表单
$.form.group(0);
// 绑定监听页面最后一个表单
$.form.group(-1);
2. $.form.rule(obj, rule, errTip, corTip, defTip, focTip, ajxTip)
说明:
设置规则、数据、提示,绑定监听输入域
参数:
参数obj以“,”分割的需要验证的表单域选择器,一般只写单个选择器
参数rule以“|”分割的验证规则,规则支持“内置规则”、“内置函数”、“JS函数”、“自定义函数”、“正则表达式”及“规则表达式”
参数errTip有2种类型,当为字符串时表示“错误提示”,以“|”进行分割,对应相应的验证规则,当errTip为对象时则表示以JSON对象形式设置提示
{
errTip: '错误提示',
corTip: '正确提示',
defTip: '默认提示',
focTip: '焦点提示',
ajxTip: '加载提示'
}
参数corTip表示正确提示
参数defTip表示默认提示
参数focTip表示焦点提示
参数ajxTip表示加载提示
使用:
// 单选择器规则设置,下例没有设置notempty的规则提示,则使用内置默认提示
$.form.rule('input[name="username"]', 'notempty|alhpaDash|limit(4,15)','|格式不正确|长度4-15');
// 多选择器相同验证规则
$.form.rule('input[name="mobile"],input[name="passport"]', 'notempty');
// 对mobile继续添加规则,ajx函数里url可以不用写引号(已做处理)
$.form.rule('input[name="mobile"]', 'mobile|ajx(/api/chkMobile)','手机格式不正确|手机号已被占用','手机号可用','联系人手机号','格式为…','检查手机号是否可用中…');
// 对密码继续添加规则,并通过eq函数绑定repassword域
$.form.rule('input[name="passport"]', 'gt(7)|eq(input[name="repassword"],true)','密码长度大于7');
// eq绑定password域
$.form.rule('input[name="repassword"]', 'eq(input[name="password"],true)',{
errTip: '2次密码输入不一致',
focTip: '请输入密码'
});
// 正则表达式规则
$.form.rule('input[name="username"]','notempty|/^[a-z][a-z0-9_]{3,14}$/);
// 规则表达式组合,以中括号包含、“|”分割的表达式组合,支持不含“|”的正则,表示或的意思,只要中括号里一项为真则该组合为真
$.form.rule('input[name="username"]', 'notempty|[email|mobile|^[a-z][a-z0-9_]{3,14}$]');
// 支持表达式取反,取反符号“!”,如下规则“!empty”同“notempty”
$.form.rule('input[name="username"]', '!empty');
// 特殊符号“#”,仅存在于第一个规则表达式前,主要用于调整类似多个input[name="contact[]"]相同规则名不同对象的验证顺序,例如下面的表单域,如果不加“#”号,则验证顺序为1->3->2->4,加“#”号,则验证顺序为1->2->3->4
$.form.rule('input[name="contactName[]"]','#notempty');
$.form.rule('input[name="contactMobile []"]','#notempty');
1)<input name="contactName[]" />
2)<input name="contactMobile[]" />
3)<input name="contactName[]" />
4)<input name="contactMobile[]" />
3. $.form.submit(opt)
说明:
正常表单提交动作监听
参数:
参数opt,一般省略
{
bindSubmit : '', // 外部触发表单提交的选择器
beforeSubmit : function() {}, // 提交操作,执行验证之前的回调
success : function() {} // 验证通过后的回调
}
4. $.form.ajxSubmit(opt)
说明:
正常表单ajax方式提交动作监听
参数:
参数opt,一般省略
{
ajxTip : '', // 请求过程序提示
errTip : '', // 错误提示
corTip : '', // 正确提示
bindSubmit : '', // 外部触发表单提交的选择器
beforeSubmit: function() {}, // 提交操作,执行验证之前的回调
beforeSend : function() {}, // ajax请求,发送数据之前的回调
success : function() {}, // ajax请求成功后的回调
error : function() {} // ajax请求失败后的回调
}
5. $.form.powSubmit(selector, opt)
说明:
非正常表单提交动作监听,支持AJAX及HTTP get方式提交,支持可编辑DIV表单。
参数:
参数opt,必填
{
url : '', // 请求URL
key : [], // 表单域name,可省略
ajax : true, // 默认AJAX方式提交
type : 'post', // 用于AJAX
ajxTip : '', // 用于AJAX请求时的加载提示
errTip : '', // 用于AJAX请求时的错误提示
corTip : '', // 用于AJAX请求时的正确提示
relative : '', // 文本域及handle祖先选择器,起限定范围作用
beforeSubmit: function() {}, // 提交操作,执行验证之前的回调
beforeSend : function() {}, // ajax请求,发送数据之前的回调
success : function() {}, // ajax请求成功后的回调
error : function() {} // ajax请求失败后的回调
}
6. $.form.way(tipWay, tipPos, tipSub)
说明:
设置验证提示方式,可单独设置每一文本域的提示方式、提示位置,也可批量设置;当tipSub === true时,表示设置公共提示方式与提示位置,当tipSub === false 时,表示不设置公共提示,否则则以最后一个验证域的“提示设置”设置公共提示。
参数:
参数tipWay,取值[0,1,2,3]或者[auto,alert,single,none],表示提式方式。分别表示“自动”、“弹窗”、“单一位置”、“无提示”
参数tipPos,提示位置选择器
参数tipSub,表示设置公共提示方式及位置
使用:
// 设置username域的验证方式为“弹出窗口式”
$.form.rule(' input[name="username"]').way('alert');
// 批量设置,在多个$.form.rule()之后加入以下代码
$.form.way('single', '#tip');
// 支持链式调用
$.form.way('none').submit();
7. $.form.blur(obj);
说明:
失去焦点触发验证函数
参数:
obj表示指定的文本域对象,一般省略
使用:
// 监听rule指定的文本域失去焦点事件
$.form.rule().blur();
// 批量设置,在多个$.form.rule()之后加入以下代码
$.form.blur();
// 支持链式调用
$.form.blur().submit();