網(wǎng)易MuMu模擬器PRO Mac版v1.2.147蘋果電腦版中文 / 385.3M
iCloud Bypass(繞過激活鎖)最新蘋果電腦版中文 / 12.8M
mac os x 10.11鏡像v10.11穩(wěn)定版中文 / 4.83G
MacOS Catalina正式版v10.15.2 官方版中文 / 4.90G
Rar解壓利器mac版v1.4 官方免費(fèi)版中文 / 10.2M
蘋果操作系統(tǒng)MACOSX 10.9.4 Mavericks完全免中文 / 4.86G
VMware Fusion 11 Pro for MacV11.0.3帶注冊中文 / 386.0M
Apowersoft Mac錄屏王v1.2.0 官方免費(fèi)版中文 / 12.2M
Total Validator Tool 這軟件幫助你檢查你的網(wǎng)頁是否符合標(biāo)準(zhǔn)，結(jié)果將幫助你迅速地解決問題。這件檢查工具有針對 W3C/ISO DTDs 的 (X)HTML 有效性，W3C WAI ，時間檢查，壞鏈檢查等。
網(wǎng)頁中經(jīng)常需要用到表單驗證功能，以往需要寫大量的代碼來驗證表單字段，而jQuery Tools提供了一套方便的表單驗證工具，熟悉之后可以節(jié)省大量的開發(fā)時間。
一、validator基本使用方法
jQuery Tools validator插件為input元素新增了幾種類型：email、number、url，將自動按照電子郵件格式，整數(shù)格式和URL格式來驗證input輸入框，同時還支持max,min,pattern,required屬性，這些都是HTML5標(biāo)準(zhǔn)的屬性和類型，即使瀏覽器不支持HTML5，jQuery tools validator也會自動識別。
示例：定義簡單驗證規(guī)則
$("input[name='email']").validator();
二、validator配置參數(shù)詳解
屬性 默認(rèn)值 說明
effect 'default' 錯誤消息顯示效果
errorClass 'invalid' 驗證失敗時給表單元素添加一個醒目的樣式
errorInputEvent 'keyup' 當(dāng)驗證有錯誤（處于錯誤狀態(tài)中），觸發(fā)單項驗證的事件名稱，還可以使用change,blur 或 null
formEvent 'submit' 表單整體驗證時機(jī)，將對所有項目進(jìn)行一次驗證
grouped false 是否將多種錯誤合并顯示.
inputEvent null 正常狀態(tài)下觸發(fā)單項驗證的事件名稱，優(yōu)先級低于errorInputEvent，也就是說當(dāng)發(fā)生錯誤時，優(yōu)先執(zhí)行errorInputEvent而忽略本項，還可以使用change,blur 或 null
lang 'en' 錯誤信息語種
message '<div/> 錯誤信息的外部元素
messageAttr 'data-message' 錯誤信息屬性名稱，如果給表單元素添加了此屬性，則發(fā)生錯誤時顯示此屬性的值
messageClass 'error' 錯誤信息的CSS樣式
offset [0, 0] 錯誤信息顯示位置的偏移量
position 'center right' 錯誤信息顯示位置，默認(rèn)在表單元素右側(cè)，上下居中
singleError false 是否每次只顯示一個錯誤信息
speed 'normal 錯誤信息漸顯速度
示例：初始化validator并傳入配置參數(shù)
$("form.vali").validator({
messageClass:"yellow",
position:"bottom left",
errorClass:"errorClass"
});
三、定義默認(rèn)錯誤提示
$.tools.validator.localize("cn", {
':email' : '請輸入電子郵件地址',
':number' : '請輸入整數(shù)',
'[max]' : '做多可以輸入$1個字符',
'[min]' : '請至少輸入$1個字符',
'[required]' : '該項為必填項目！'
});
$("#myForm").validator({lang: 'cn'});
以上代碼定義了一系列語種名稱為'cn'的默認(rèn)錯誤提示信息。如果僅需要對某些單獨(dú)的字段設(shè)置多語種版本，可以使用以下方法
$.tools.validator.localizeFn("[type=time]", {
en: 'Please supply a valid time',
cn: '請輸入正確的時間格式'
});
四、自定義驗證規(guī)則
//簡單用法
$.tools.validator.fn("[type=time]", function(el, value) {
return /\d\d:\d\d/.test(value) ? true : "錯誤的事件格式";
});
//高級用法
$.tools.validator.fn(
"[type=range]",
"請輸入介于 $1 至 $2 之間的值",
function(el, v) {
// 獲取min屬性和max屬性的值
var min = el.attr("min"), max = el.attr("max"), value = parseFloat(v);
// 如果符合規(guī)則返回true，否則返回一個對象，可用于錯誤提示中替換占位符
return value >= min && value < max true min maxbr> }
);
//高級用法2
$.tools.validator.fn(
// 第一個參數(shù)用于檢測是否適用本驗證規(guī)則，如果匹配則返回true
function() {
return $(this).parents("form.register").length > 0;
// 第二個參數(shù)為驗證函數(shù)
}, function(el, v) {
// 如果驗證通過則返回true
return true;
}
);
//高級用法3
// 定義匹配函數(shù)
function myMatcher() {
return $(this).parents("form.register").length > 0;
}
// 作用對象
myMatcher.key = "register-input";
// 使用指定的匹配函數(shù)
$.tools.validator.fn(myMatcher, "請?zhí)顚懻_的值", function(el, v) {
// 驗證通過返回true
return true;
});
五、使用服務(wù)端遠(yuǎn)程ajax驗證
// 初始化 validator 并自定義的表單提交事件處理辦法
$("#myform").validator({ position: 'center right' }).submit(function(e) {
var form = $(this);
// 客戶端驗證已通過的情況下再使用遠(yuǎn)程驗證
if (!e.isDefaultPrevented()) {
// 使用AJAX提交表單數(shù)據(jù)，你也可以使用post或其他方式提交表單
$.getJSON(form.attr("action") + "?" + form.serialize(), function(json) {
// 遠(yuǎn)程驗證通過時返回true
if (json === true) {
form.load("success.php");//具體成功后怎么處理隨你
} else {
// 遠(yuǎn)程驗證失敗. 使用 invalidate() 顯示錯誤信息
form.data("validator").invalidate(json);
}
});
// 阻止表單提交事件冒泡，即表單事件到此處理完畢
e.preventDefault();
}
});
遠(yuǎn)程AJAX返回錯誤信息的話需要使用JSON格式，如下：
{
"zip": "You must live in northern Finland in order to proceed",
"total": "You gave us too much money! Please check"
}
六、使用自定義效果顯示/隱藏錯誤信息
// 定義名稱為wall的效果
$.tools.validator.addEffect("wall",
function(errors, event) {
// 顯示方法
$.each(errors, function(index, error) {
// 獲取表單對象
var input = error.input;
// 獲取錯誤信息
var errors = error.messages;
//剩下的你自己想怎么處理就在這里寫代碼
});
}, function(inputs) {
// 隱藏方法，定義隱藏時的特效
}
);
七、Validator的API方法調(diào)用
方法 返回值類型 說明
checkValidity() boolean 立即執(zhí)行表單驗證
destroy() API 銷毀 validator 實例.
getConf() Object 返回當(dāng)前 validator 實例的參數(shù)配置.
getForm() jQuery 返回表單對象
getInputs() jQuery 返回所有的input對象
invalidate(Object) API 強(qiáng)制顯示錯誤信息，參數(shù)為JSON格式。主要用于從服務(wù)端接收到遠(yuǎn)程驗證的錯誤后進(jìn)行顯示.
reflow() API 修正錯誤信息的顯示位置，因為錯誤信息是以絕對定位的方式顯示的，有時候表單位置發(fā)生改變會導(dǎo)致錯誤信息顯示的位置不正確，調(diào)用此函數(shù)進(jìn)行修正。
reset(jQuery) API 重置"驗證錯誤"，如果參數(shù)為空，則重置所有字段；如果表單里有reset按鈕，則會被自動添加這個功能。
使用方法：
$('#myform').data("validator").checkValidity();
特別說明
聲明：西西軟件園為非贏利性網(wǎng)站 不接受任何贊助和廣告
