Validate插件

為表單提供了強大的驗證功能，讓客戶端表單驗證變得更簡單，同時提供了大量的定制選項，滿足應用程序各種需求。

該插件捆綁了一套有用的驗證方法，包括URL和電子郵件驗證，同時提供了一個用來編寫用戶自定義方法的API。
所有的捆綁方法默認使用英語作為錯誤信息，且已翻譯成其他37種語言

引入JS

<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script> <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>

默認校驗規則

required:true
須輸入的字段

remote:”check.php”
使用ajax方法調用check.php驗證輸入值

email:true
必須輸入正確格式的電子郵件

url:true
必須輸入正確格式的網址

date:true
必須輸入正確格式的日期。日期校驗ie6出錯，慎用

dateISO:true
必須輸入正確格式的日期（ISO），例如：2009-06-23，1998/01/22。只驗證格式，不驗證有效性

number:true
必須輸入合法的數字（負數，小數）

digits:true
必須輸入整數

creditcard:
必須輸入合法的信用卡號

equalTo:”#field”
輸入值必須和#field相同

accept:
輸入擁有合法后綴名的字符串（上傳文件的后綴）

maxlength:5
輸入長度最多是5的字符串（漢字算一個字符）

minlength:10
輸入長度最小是10的字符串（漢字算一個字符）

rangelength:[5,10]
輸入長度必須介于5和10之間的字符串（漢字算一個字符）

range:[5,10]
輸入值必須介于5和10之間

max:5
輸入值不能大于5

min:10
輸入值不能小于10

默認提示信息

messages: {required: "This field is required.",remote: "Please fix this field.",email: "Please enter a valid email address.",url: "Please enter a valid URL.",date: "Please enter a valid date.",dateISO: "Please enter a valid date ( ISO ).",number: "Please enter a valid number.",digits: "Please enter only digits.",creditcard: "Please enter a valid credit card number.",equalTo: "Please enter the same value again.",maxlength: $.validator.format( "Please enter no more than {0} characters." ),minlength: $.validator.format( "Please enter at least {0} characters." ),rangelength: $.validator.format( "Please enter a value between {0} and {1} characters long." ),range: $.validator.format( "Please enter a value between {0} and {1}." ),max: $.validator.format( "Please enter a value less than or equal to {0}." ),min: $.validator.format( "Please enter a value greater than or equal to {0}." ) }

Validate提供了中文信息提示包
位于下載包的dist/localization/messages_zh.js
可以將該本地化信息文件dist/localization/messages_zh.js引入到頁面

引入JS

<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>

中文提示信息

(function( factory ) {if ( typeof define === "function" && define.amd ) {define( ["jquery", "../jquery.validate"], factory );} else {factory( jQuery );} }(function( $ ) {/** Translated default messages for the jQuery validation plugin.* Locale: ZH (Chinese, 中文 (Zhōngwén), 漢語, 漢語)*/$.extend($.validator.messages, { required: "這是必填字段", remote: "請修正此字段", email: "請輸入有效的電子郵件地址", url: "請輸入有效的網址", date: "請輸入有效的日期", dateISO: "請輸入有效的日期 (YYYY-MM-DD)", number: "請輸入有效的數字", digits: "只能輸入數字", creditcard: "請輸入有效的信用卡號碼", equalTo: "你的輸入不相同", extension: "請輸入有效的后綴", maxlength: $.validator.format("最多可以輸入 {0} 個字符"), minlength: $.validator.format("最少要輸入 {0} 個字符"), rangelength: $.validator.format("請輸入長度在 {0} 到 {1} 之間的字符串"), range: $.validator.format("請輸入范圍在 {0} 到 {1} 之間的數值"), max: $.validator.format("請輸入不大于 {0} 的數值"), min: $.validator.format("請輸入不小于 {0} 的數值") }); }));

總結

以上是生活随笔為你收集整理的jQuery的Validate插件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。