表單驗證插件----jquery validation

時間 2020-05-29

原文原文鏈接

一、下載地址：http://jqueryvalidation.org/javascript

二、使用方法：php

<script type="text/javascript" src="http://www.xftz.cn/templets/yuanyou/js/jquery-1.12.1.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
jquery表單對象.validate()

三、validade()方法css

做用：驗證選中的表單，傳入一個配置對象用於對驗證進行各類配置。java

3.1.一、rulesjquery

做用：爲各類表單元素添加各類驗證規則git

類型：objectajax

使用方法：rules：{服務器

　　　　name屬性值：{app

　　　　驗證規則1,dom

　　　　驗證規則2,

　　　　...

　　　　}...

}

3.1.二、內置的驗證規則：

1)、required：必須輸入的字段

使用：required：true，若是這個標籤只有這一條驗證規則，能夠簡寫：name屬性值："required"

2)、minlength:最小字符長度

3)、maxlength:最大字符長度

4)、rangelength:字符長度必須介於某個區間

使用：rangelength：[2,3]

5)、min：輸入值被容許的最小值（數字）

6)、max：輸入值被容許的最大值（數字）

7)、range:[5,10]，輸入值必須介於某個區間

8)、number：true，必須是合法的數字

9)、digits:true,必須是整數

10)、email:true,必須是正確的郵箱

11)、url:true,必須是正確的網址

12)、equalTo：jq選擇器，輸入值必須和給定選擇器的值相同

13)、remote：{

　　　　　　url："check_email.php",

　　　　　　type:"post",

　　　　　　data:{

　　　　　　　　username:"xulinjun"

　　　　　　}

使用ajax方法，調用服務器端腳本，驗證輸入值

14)、extension：限定特定格式的後綴名，多個用"|"隔開，（須要引入additional-methods.min文件）

四、提示信息的漢化

4.一、直接引入漢化包

<script type="text/javascript" src="js/dist/localization/messages_zh.min.js"></script>

4.二、messages

若是須要在validate()方法內修改提示信息，則可使用本方法，

自定義的提示信息，key：value的形式，key是要驗證的元素，value能夠是字符串或函數，舉例：

messages:{
                username:{
                    required:"必須填寫"
                },
            　　username1:{
                    required:"必須填寫",
                    equalTo:"倆次輸入不一致"
                }
            }
//這裏rules上面的值，messages裏面能夠同步使用，{0}表明第一個，{1}表明第二個...舉例：

username:{
　　required:"必須填寫",
　　min:"最小的值必須是{0}"
}

五、submitHandler

類型：function(form)

說明，經過驗證後運行的函數，默認添加該函數則不會再提交除非手動提交或者使用return true，

函數參數：該函數接收一個參數，表示當前表單dom對象

六、invalidHandler(event,validator)

說明，當一個無效的表單（即驗證不經過的時候）被提交的時候觸發這個函數

函數參數：當前驗證的表單validator對象

七、errorClass（默認值error）

類型：string

說明：指定錯誤提示與驗證不經過的控件的css類名

八、validClass（默認值：valid）