Analysis of jquery. validate Form Verification plug-in usage

Jquery. validate Form Verification plug-in uses the method to parse why jquery validate Form Verification plug-in is used: it is not easy to write a general and powerful jquery Form Verification plug-in. Jquery validate is a jquery plug-in that can easily handle Form Verification for more than 95%. The specific content is as follows:

Usage

1. Use the default verification rules in the control, for example:
Email (required)

2. You can customize verification rules in the control, for example:
Custom (required, [3, 5])

3. Using javascript custom verification rules, the following javascript custom two rules: password and confirm_password

$ (). Ready (function () {$ ("# form2 "). validate ({rules: {password: {required: true, minlength: 5}, confirm_password: {required: true, minlength: 5, failed to: "# password"}, messages: {password: {required: "No password entered", minlength: jQuery. format ("the password cannot be less than {0} characters")}, confirm_password: {required: "No Password confirmed", minlength: "The password cannot be less than {0} characters ", failed to: "inconsistent passwords entered twice "}}});});

In addition to true/false, required can also use expressions or functions, such

$ ("# Form2"). validate ({rules: {funcvalidate: {required: function () {return $ ("# password"). val ()! = "" ;}}, Messages: {funcvalidate: {required: "required if a password exists "}}});

Html

PasswordConfirm PasswordCondition Verification

4. Use meta to customize verification information

Set meta with JS first

$ ("# Form3"). validate ({meta: "validate "});

Html

Email

5. You can use meta to write verification rules in custom tags, such as validate.

Set meta in JS

$().ready(function() { $.metadata.setType("attr", "validate"); $("#form1").validate();});

Html

Email

6. Custom verification rules

For complex verification, you can use jQuery. validator. addMethod to add custom verification rules.

The additional-methods.js provided by the official website contains some common verification methods, such as lettersonly, ziprange, nowhitespace, etc.

Example

// Verify jQuery. validator. addMethod ("userName", function (value, element) {return this. optional (element) |/^ [\ u0391-\ uFFE5 \ w] + $ /. test (value) ;}, "the user name can only contain Chinese characters, English letters, numbers, and underscores"); // then you can use this rule $ ("# form1 "). validate ({// verification rule rules: {userName: {required: true, userName: true, rangelength: [5, 10]},/* set error message */messages: {userName: {required: "Enter the user name", rangelength: "The user name must be between 5-10 characters "}},});

7. The verification methods of radio, checkbox, and select are similar.

Radio Verification

Gender Male
Female

Checkbox Verification

Select at least two items

Option 1
Option 2
Option 3

Select Verification

Drop-down list

   1 2 3 

8. Ajax Verification

Remote can be used for Ajax Verification

Remote: {url: "url", // url type: "post", // transmission method dataType: "json", // data format data: {// username: function () {return $ ("# username "). val ();}}}

Multiple types of user information are verified: