Implementation of Jquery-based tag smart verification code _ jquery-js tutorial

I have been searching for the fastest and most convenient method for information verification. I have compiled JavaScript code for verification before, but I have to write a lot of auxiliary code. After many improvements, I still think it is too troublesome for more code, maintenance is too costly. After a piece of learning about Jquery, Jquery's power solves the problem of too much auxiliary code to be easily maintained.
AutoValidate. JS

The Code is as follows:

///
// Verification method v1.0, created in 2010-12-9 to complete the 2010-12-16 MR. X System
// Modify 2010-12-10, 2010-12-12, 2010-12-15, and 2010-12-16 to add information indicating the animation effect.
// Supports type = text type = checkbox type = radio select Label Verification
// Vld = "***" format verification required
// Vld = "n ***" Optional format Verification
// Err = "***" error display content
// Super = "y": append the prompt information. You must modify the same-level verification group with letters other than y, tags of the same level can be identified by the super = "y" attribute in the first tag.
// Len = "***" length limit, used for textarea labels
//
$ (Function (){
// Regular anonymous object
Var strRegex = {};
// Anonymous error message object
Var strError = {};
// Anonymous object with correct information
Var strRight = {};
/** Parameter configuration start **/
// Not empty
StrRegex. NoNull =/[^ \ s] + /;
StrError. NoNull = "please fill in the content, such as 123, China! ";
// Email
StrRegex. email =/^ ([a-zA-Z0-9 _-]) + @ ([a-zA-Z0-9 _-]) + ((\. [a-zA-Z0-9 _-] {2, 3}) {1, 2}) $ /;
StrError. Email = "Please check the mailbox format, such as china@163.com! ";
// URL
StrRegex. Url =/^ http: \ // [A-Za-z0-9] + \. [A-Za-z0-9] + [\/= \? % \-&_~ '@ [\] \': +!] * ([^ \ "\"]) * $ /;
StrError. Url = "Please check Url format, such as http://www.jb51.net! ";
// Account
StrRegex. An =/^ ([a-zA-Z0-9] | [_]) {6, 16} $ /;
StrError. An = "check the account format, for example, china_56! ";
// Number
StrRegex. Math =/\ d + $ /;
StrError. Math = "Check the digit format, for example, 1234! ";
// Age
StrRegex. Age =/^ \ d {2} $ /;
StrError. Age = "Please check the Age format, 10 ~ Between 99 years old! ";
// Zip code
StrRegex. Post =/^ [1-9] \ d {5} $ /;
StrError. Post = "Please check the zip code format, such as 150001! ";
// Call
StrRegex. phone =/^ (\ d {11}) | (\ d {7, 8}) | (\ d {4} | \ d {3 }) -(\ d {7, 8}) | (\ d {4} | \ d {3})-(\ d {7, 8 }) -(\ d {4} | \ d {3} | \ d {2} | \ d {1}) | (\ d {7, 8 }) -(\ d {4} | \ d {3} | \ d {2} | \ d {1}) $ /;
StrError. Phone = "check the Phone number format, such as 15546503251! ";
// ID card
StrRegex. card =/^ ([1-9] \ d {5} [1-9] \ d {3} (0 \ d) | (1 [0-2]) ([0 | 1 | 2] \ d) | 3 [0-1]) (\ d {4 }) | \ d {3} [X, x]) | ([1-9] \ d {5} [1-9] \ d {1} (0 \ d) | (1 [0-2]) ([0 | 1 | 2] \ d) | 3 [0-1]) (\ d {3}) $ /;
StrError. Card = "Check the ID Card format, for example, 230103190001010000! ";
// Money
StrRegex. Price =/^ ([1-9] \ d * | 0) (\. \ d + )? $ /;
StrError. Price = "Please check the money format, such as 99.98! ";
// Date
StrRegex. date =/(^ (1 [8-9] \ d {2}) | ([2-9] \ d {3 })) ([-\/\. _]) (10 | 12 | 0? [13578]) ([-\/\. _]) (3 [01] | [12] [0-9] | 0? [1-9]) $) | (^ (1 [8-9] \ d {2}) | ([2-9] \ d {3 })) ([-\/\. _]) (11 | 0? [469]) ([-\/\. _]) (30 | [12] [0-9] | 0? [1-9]) $) | (^ (1 [8-9] \ d {2}) | ([2-9] \ d {3 })) ([-\/\. _]) (0? 2) ([-\/\. _]) (2 [0-8] | 1 [0-9] | 0? [1-9]) $) | (^ ([2468] [048] 00) ([-\/\. _]) (0? 2 )([-\/\. _]) (29) $) | (^ ([3579] [26] 00 )([-\/\. _]) (0? 2 )([-\/\. _]) (29) $) | (^ ([1] [89] [0] [48]) ([-\/\. _]) (0? 2 )([-\/\. _]) (29) $) | (^ ([2-9] [0-9] [0] [48]) ([-\/\. _]) (0? 2 )([-\/\. _]) (29) $) | (^ ([1] [89] [2468] [048]) ([-\/\. _]) (0? 2 )([-\/\. _]) (29) $) | (^ ([2-9] [0-9] [2468] [048]) ([-\/\. _]) (0? 2 )([-\/\. _]) (29) $) | (^ ([1] [89] [13579] [26]) ([-\/\. _]) (0? 2 )([-\/\. _]) (29) $) | (^ ([2-9] [0-9] [13579] [26]) ([-\/\. _]) (0? 2) ([-\/\. _]) (29) $ ))/;
StrError. Date = "check the Date format, for example, 1999-9-9, and! ";
// Time
StrRegex. time =/^ ([0-9] | [0-1] [0-9] | [2] [0-3]) (: | :) ([0-5] [0-9]) $ /;
StrError. Time = "check the Time format, for example! ";
StrError. Length = "check the Length of the input information. The Length is smaller ";
StrRight. Info = "The format is correct! "; // Can be set to null
// Drop-down list
StrRegex. DDL = "select ";
StrError. DDL = "select option ";
// Check box for a single checkbox
StrRegex. Check = "select ";
StrError. Check = "select option ";
// Single radio check box
StrRegex. Radio = "select ";
StrError. Radio = "select option ";
// Check box for a group of checkpoints at the same level
StrRegex. CheckGroup = "select ";
StrError. CheckGroup = "select option ";
// Check box for a set of radio at the same level
StrRegex. RadioGroup = "select ";
StrError. RadioGroup = "select option ";
// Append information to the tag
Var SpanError = "";
Var SpanOk = "";
/** Configure the end parameter **/
/** Main **/
// File directory, return to the top directory ../
Function FilePath (){
Var file = "";
Var path = window. location. pathname. split ('/');
$ (Path). each (function (){
File = "../" + file;
});
Return file;
}
// Page verification self-check
$ ("# Form1 [vld]"). blur (function (){
RegexGether ($ (this ));
});
// Verification processing set
Function RegexGether ($ ctrl ){
Switch ($ ctrl. attr ("vld ")){
Case "nonull ":
RegexNull ($ ctrl );
Break;
Case "age ":
RegexInputTextAll ($ ctrl, strRegex. Age, strError. Age );
Break;
Case "nage ":
RegexInputTextOnly ($ ctrl, strRegex. Age, strError. Age );
Break;
Case "date ":
RegexInputTextAll ($ ctrl, strRegex. Date, strError. Date );
Break;
Case "ndate ":
RegexInputTextOnly ($ ctrl, strRegex. Date, strError. Date );
Break;
Case "price ":
RegexInputTextAll ($ ctrl, strRegex. Price, strError. Price );
Break;
Case "nprice ":
RegexInputTextOnly ($ ctrl, strRegex. Price, strError. Price );
Break;
Case "email ":
RegexInputTextAll ($ ctrl, strRegex. Email, strError. Email );
Break;
Case "nemail ":
RegexInputTextOnly ($ ctrl, strRegex. Email, strError. Email );
Break;
Case "post ":
RegexInputTextAll ($ ctrl, strRegex. Post, strError. Post );
Break;
Case "npost ":
RegexInputTextOnly ($ ctrl, strRegex. Post, strError. Post );
Break;
Case "card ":
RegexInputTextAll ($ ctrl, strRegex. Card, strError. Card );
Break;
Case "ncard ":
RegexInputTextOnly ($ ctrl, strRegex. Card, strError. Card );
Break;
Case "time ":
RegexInputTextAll ($ ctrl, strRegex. Time, strError. Time );
Break;
Case "ntime ":
RegexInputTextOnly ($ ctrl, strRegex. Time, strError. Time );
Break;
Case "math ":
RegexInputTextAll ($ ctrl, strRegex. Math, strError. Math );
Break;
Case "nmath ":
RegexInputTextOnly ($ ctrl, strRegex. Math, strError. Math );
Break;
Case "url ":
RegexInputTextAll ($ ctrl, strRegex. Url, strError. Url );
Break;
Case "nurl ":
RegexInputTextOnly ($ ctrl, strRegex. Url, strError. Url );
Break;
Case "":
RegexInputTextAll ($ ctrl, strRegex. An, strError. );
Break;
Case "nan ":
RegexInputTextOnly ($ ctrl, strRegex. An, strError. );
Break;
Case "phone ":
RegexInputTextAll ($ ctrl, strRegex. Phone, strError. Phone );
Break;
Case "nphone ":
RegexInputTextOnly ($ ctrl, strRegex. Phone, strError. Phone );
Break;
Case "ddl ":
RegexSelect ($ ctrl );
Break;
Case "check ":
RegexInputCheckBoxRadioOnly ($ ctrl, strError. Check );
Break;
Case "radio ":
RegexInputCheckBoxRadioOnly ($ ctrl, strError. Radio );
Break;
Case "checkgroup ":
RegexInputCheckBoxRadioAll ($ ctrl, strError. CheckGroup );
Break;
Case "radiogroup ":
RegexInputCheckBoxRadioAll ($ ctrl, strError. RadioGroup );
Break;
}
}
// Empty TAG content verification
Function RegexNull ($ ctrl ){
If (strRegex. NoNull. test ($ ctrl. val ())){
Return RegexLen ($ ctrl );
}
Else {
Error ($ ctrl, strError. NoNull );
Return false;
}
}
// Verify multiple input (type = radio) or input (type = checkbox) tags at the same level
Function RegexInputCheckBoxRadioAll ($ ctrl, error ){
If ($ ctrl. parent (). children (": checked"). length = 0 ){
If ($ ctrl. parent (). children (). attr ("super ")){
// Multiple [super = 'y'] may exist in the same-level labels. Only one of them can be obtained, and return false is used. To control and execute one operation, the same-level labels will jump out of the loop body.
$ Ctrl. parent (). children ("[super = 'y']"). each (function (){
Error ($ (this), error );
Return false;
});
}
Else {
// An error is reported when a group of tags at the same level are displayed.
$ Ctrl. parent (). children ("[type = '" + $ ctrl. attr ("type") + "']"). each (function (){
Error ($ (this), error );
});
}
Return false;
}
Else {
If ($ ctrl. parent (). children (). attr ("super ")){
$ Ctrl. parent (). children ("[super = 'y']"). each (function (){
OK ($ (this ));
Return false;
});
}
Else {
$ Ctrl. parent (). children (). each (function (){
OK ($ (this ));
});
}
Return true;
}
}
// Verify the single input (type = radio) label or input (type = checkbox) Label
Function RegexInputCheckBoxRadioOnly ($ ctrl, error ){
If (! $ Ctrl. attr ("checked ")){
Error ($ ctrl, error );
Return false;
}
Else {
OK ($ ctrl );
Return true;
}
}
// Select tag, option Verification
Function RegexSelect ($ ctrl ){
If ($ ctrl. val () = strRegex. DDL ){
Error ($ ctrl, strError. DDL );
Return false;
}
Else {
OK ($ ctrl );
Return true;
}
}
// Label can be empty content format verification, type = text Label Verification
Function RegexInputTextOnly ($ ctrl, Regex, error ){
// Verify whether the tag is empty.
If (strRegex. NoNull. test ($ ctrl. val ())){
Return RegexOtherFormat ($ ctrl, Regex, error );
}
Else {
OK ($ ctrl );
Return true;
}
}
// Label cannot be empty content format verification, type = text Label Verification
Function RegexInputTextAll ($ ctrl, Regex, error ){
// Verify whether the tag is empty.
If (strRegex. NoNull. test ($ ctrl. val ())){
Return RegexOtherFormat ($ ctrl, Regex, error );
}
Else {
Error ($ ctrl, error );
Return false;
}
}
// TAG content format Verification
Function RegexOtherFormat ($ ctrl, Regex, error ){
If (Regex. test ($ ctrl. val ())){
Return RegexLen ($ ctrl );
}
Else {
Error ($ ctrl, error );
Return false;
}
}
// Textarea label length Verification
Function RegexLen ($ ctrl ){
// Whether the tag has the len attribute
If ($ ctrl. attr ("len ")){
Var error = strError. Length + $ ctrl. attr ("len") +! ";
If (parseInt ($ ctrl. val (). length)> parseInt ($ ctrl. attr ("len "))){
Error ($ ctrl, error );
Return false;
}
}
OK ($ ctrl );
Return true;
}
// Format verification error display
Function Error ($ ctrl, error ){
// The tag contains the err attribute. Enter the attribute content in the title field.
If ($ ctrl. attr ("err ")){
Error = $ ctrl. attr ("err ");
}
If ($ ctrl. attr ("super ")){
// Append span with the super attribute label
$ Ctrl. parent (). find ("span"). remove ();
$ Ctrl. parent (). append (SpanError );
$ Ctrl. parent (). find ("span"). append (error );
$ Ctrl. parent (). find ("span"). fadeTo ("slow", 0.66 );
}
Else {
// Append to the title attribute
$ Ctrl. attr ("title", error );
$ Ctrl. addClass ("error ");
}
}
// The format is verified correctly. Clear the error style.
Function OK ($ ctrl ){
// Remove valid error styles
If ($ ctrl. attr ("super ")){
$ Ctrl. parent (). find ("span"). remove ();
}
Else {
$ Ctrl. removeClass ("error ");
}
If ($. trim ($ ctrl. val (). length> 0 ){
Var right = strRight. Info;
// Check whether the tag has the rig attribute
If ($ ctrl. attr ("rig ")){
Right = $ ctrl. attr ("rig ");
}
// Add the Correct prompt information
If ($ ctrl. attr ("super ")){
$ Ctrl. parent (). append (SpanOk );
$ Ctrl. parent (). find ("span"). append (right );
$ Ctrl. parent (). find ("span "). fadeTo ("slow", 0.99 ). fadeTo ("slow", 0.99 ). fadeTo ("slow", 0 );
}
Else {
$ Ctrl. attr ("title", right );
}
}
}
// Submit self-check
$ ("# VldBtn"). click (function (){
$ ("# Form1 [vld]"). each (function (){
RegexGether ($ (this ));
});
// Check whether the style in the label has an error
If ($ ("# form1 [vld] [class = 'error']"). length> 0 ){
Return false;
}
Else {
Return true;
}
});
});

AutoValidate.htm

The Code is as follows: