## $.fn (插件方法)
### .validator()
#### .validator( options )
**描述**:根據參數初始化驗證,驗證 jQuery 選中的表單
**參數**:*{Object}*options - 可選,參考[配置選項](https://validator.niceue.com/docs/options.html)
**示例**:
~~~javascript
$('#form1').validator({
timely: 2,
stopOnError: true,
fields: {
email: "required;email",
password: "required;length(6~16)",
mobile: "required;mobile"
},
valid: function(form) {
$.post("path/to/server", $(form).serialize())
.done(function(){
// some code
});
}
});
~~~
#### .validator( validCallback )
**描述**:初始化驗證,驗證 jQuery 選中的表單,驗證通過后執行回調
**參數**:*{Function}*validCallback - 表單驗證通過的回調
**示例**:
~~~javascript
$('#form1').validator(validCallback);
// 等同于
$('#form1').validator({
valid: validCallback
});
~~~
#### .validator( instanceMethod, arg1, arg2... )
**描述**:通過`.validator()`方法調用實例方法
**參數**:*{String}*instanceMethod - 實例方法名稱
**參數**:*{Arguments}*argn - 調用實例方法時的參數
**示例**:
~~~javascript
// 清空表單驗證消息
$('#form1').validator("cleanUp");
// 銷毀表單驗證
$('#form1').validator("destroy");
~~~
### .isValid( callback )
**描述**:判斷某個區域或者某個字段是否驗證通過,如果字段中有異步 ajax 驗證,需要通過 callback 獲取驗證結果
**參數**:*{Function}*callback - 回調函數
**示例**:
~~~javascript
// 使用回調函數獲取驗證結果
$('#mobile').isValid(function(v){
if (v) {
// do something
}
});
// v0.10.5+ 還支持下面這種寫法,即回調不帶參數,就是驗證通過的回調
$('#mobile').isValid(function(){
// do something
});
// 如果驗證的字段中沒有 ajax 異步驗證,直接獲取結果也是可以的
if ( $('#mobile').isValid() ) {
// do something
}
~~~
## $.validator (靜態方法)
### $.validator(selector, options)
**描述**:初始化表單。如果`selector`選擇的元素存在于 DOM,其等同于`$(selector).validator(options)`這種寫法。如果不存在,nice-validator 會預初始化該選擇器選中的表單,等到該表單存在時就可以直接被驗證。
**參數**:*{jqSelector|Element}*selector - jQuery 選擇器(支持預初始化),或者 DOM Element
**參數**:*{Object}*options - 參考[配置選項](https://validator.niceue.com/docs/options.html)
**示例**:
~~~javascript
// 即使 "#form1" 這個表單被動態加載,也可以驗證
$.validator("#form1", {
timely: 2,
stopOnError: true,
fields: {
email: "required;email",
password: "required;length(6~16)",
mobile: "required;mobile"
}
});
~~~
### .config(options)
**描述**:配置全局選項
**參數**:*{Object}*options - 參考[配置選項](https://validator.niceue.com/docs/options.html)
**示例**:
~~~javascript
$.validator.config({
timely: 2
});
~~~
### .setTheme(name, options)
**描述**:配置全局主題
**參數**:*{String}*name - 主題名稱
**參數**:*{Object}*options - 參考[配置選項](https://validator.niceue.com/docs/options.html)
**示例**:
~~~javascript
$.validator.setTheme("myTheme", {
formClass: "nice-flat",
msgClass: "n-right",
timely: 2,
stopOnError: true
});
~~~
## instance (實例方法)
> 實例方法需要獲取對象實例,才能調用。
> 驗證初始化的時候會自動初始實例,通過`$form.data('validator')`可以獲取到實例
### .test(elem, rule)
**描述**:驗證字段是否符合指定的規則
**參數**:*{Element}*elem - DOM 元素
**參數**:*{String}*rule - 規則
**返回**:*{Boolean}*
**示例**:
~~~javascript
$("#myForm").validator({
rules: {
loginName: function(element) {
return /^[a-zA-Z]\w{3,}/.test(element.value)
|| this.test(element, "mobile")
|| this.test(element, "email")
|| 'Please fill user name, phone number or E-mail';
}
},
fields: {
username: "required; loginName",
password: "required; length(6~16)"
}
});
~~~
### .setField()
#### .setField(key, field)
**描述**:動態配置字段參數
**參數**:*{String}*key - 字段 name 或者 #id
**參數**:*{Object}*field - 字段參數
**示例**:
~~~javascript
$('form').validator("setField", "username", "required;");
// Remove the field's verification.
$('form').validator("setField", "username", null);
~~~
#### .setField(obj)
**描述**:動態配置字段參數
**參數**:*{Object}*obj - 字段參數 Hash
**示例**:
~~~javascript
$('form').validator("setField", {
username: "required;username",
pwd: "required;password"
});
~~~
### .showMsg(elem, obj)
**描述**:使字段提示消息(不推薦),推薦使用[.trigger("showmsg")](https://validator.niceue.com/docs/events.html#section-2-2)
**參數**:*{Element | jqSelector}*elem - DOM 元素或者 jQuery 選擇器
**參數**:*{Object}*obj - 參數
**示例**:
~~~javascript
// 單個字段提示消息
$('form').validator('showMsg', '#mobile', {
type: "error",
msg: "Phone number already exists."
});
// 映射消息到多個字段
$('form').validator('showMsg', {
mobile: {
type: "error",
msg: "Phone number already exists."
},
email: {
type: "error",
msg: "Email already exists."
}
});
~~~
### .hideMsg(elem)
**描述**:使字段隱藏消息(不推薦),推薦使用[.trigger("hidemsg")](https://validator.niceue.com/docs/methods.html#section-3-4)
**參數**:*{Element|jqSelector}*elem - DOM 元素或者 jQuery 選擇器
**示例**:
~~~javascript
$('#form1').validator('hideMsg', '#mobile');
// or
$('#form1').data('validator').hideMsg('#mobile');
~~~
### .holdSubmit(hold)
**描述**:防止表單重復提交的措施
**參數**:{Boolean} hold - 是否控制表單提交
**示例**:
~~~javascript
$("#myForm").validator({
valid: function(form){
var me = this;
// Before submitting the form, hold form, to prevent duplicate submission.
me.holdSubmit();
$.ajax({
url: "xxx.php",
data: $(form).serialize(),
type: "POST",
success: function(){
// After the form is submitted successfully, release hold.
me.holdSubmit(false);
}
});
}
});
~~~
### .cleanUp()
**描述**:清除表單中的全部驗證消息
**示例**:
~~~javascript
$('#form1').validator('cleanUp');
~~~
### .destroy()
**描述**:銷毀表單驗證實例
**示例**:
~~~javascript
$('#form1').validator('destroy');
~~~