引入jquery.js,jquery.validate.min.js
驗證規則以:data-rule-為字首
如果啟用了長度驗證或者值範圍驗證,則必須啟用必填驗證,否則長度與範圍的驗證將不會起作用.
表單項中,不要相同name的表單驗證元素,否則只會驗證第乙個name的表單元素
支援的驗證規則有:
minlength://輸入字元最小長度(中文算乙個字元)
maxlength: //輸入字元最大長度(中文算乙個字元)
min: //數值最小值
max: //
數值最大值
equalto: //再次輸入相同的值
rangelength: //輸入字元最小，最大長度(中文算乙個字元)
range: //數值最小，最大值
required: //必填email: //
郵箱位址
url: //
url位址
date: //
日期dateiso: //
iso格式的日期(2014/08/27 或 2014-08-27)
number: //
數字(負數，正數，小數，整數)
digits: //
正整數creditcard: //
信用卡
remote: //遠端驗證, p.s.
注：請求返回的 response === true || response === 'true'，才算驗證通過，這需要後端的配合
e.g
//修改預設驗證規則
jquery.extend(jquery.validator.messages, 個字元"),
minlength: jquery.validator.format("允許的最小長度為 個字元"),
rangelength: jquery.validator.format("允許的長度為和之間"),
range: jquery.validator.format("請輸入介於 和 之間的值"),
max: jquery.validator.format("請輸入乙個最大為 的值"),
min: jquery.validator.format("請輸入乙個最小為 的值")
});
自定義驗證器
jquery.validator.addmethod("ismobile", function(value, element) )|(15[0-9]))+\d)$/;
return (length
== 11 && mobile.exec(value))? true:false;
}, "請正確填寫您的手機號碼");
手動觸發驗證
$('button').bind('click', function() ,
highlight : function(ele, errorclass) );}},
unhighlight : function(ele, errorclass, validclass)
});//驗證通過會返回true,否則返回false
console.log(validator.form());
});
在使用中可能會遇到的問題:
1. 乙個表單中有多個input, 但是只驗證了第乙個input
問題原因: 多個input都是同乙個name所以只會驗證第乙個name
jquery validation驗證外掛程式
序號規則描述1 required true 必須輸入的字段。2remote check.php 使用 ajax 方法呼叫 check.php 驗證輸入值。3email true 必須輸入正確格式的電子郵件。4url true 必須輸入正確格式的 5date true 必須輸入正確格式的日期。日期校驗...
jQuery Validation使用教程
1 匯入js庫 jquery validation是基於jquery為核心的，所以必須先導入jquery核心js檔案 接著匯入jquery validation核心js 匯入中文提示資訊js2 預設校驗規則 3 預設提示 messages characters.minlength validator...
Jquery validation表單驗證使用方法
color darkblue size medium 作用 jquery.validate是jquery旗下的乙個驗證框架，借助jquery的優勢，我們可以迅速驗證一些常見的輸入,並且可以自己擴充自己的驗證方法，並且對國際化也有很好的支援。使用前的布置 說明 需要jquery版本 1.2.6 步驟 ...