Common form validation functions in JavaScript

Check.js js function file

The code is as follows

Copy Code

//////////////////////////////////////////////////////////////////////////////// /* *---------------Common validation checkform (oform) for client forms----------------- * Function: Universal validation of all form elements. Use * <form name= "Form1" onsubmit= "return Checkform (This)" >* <input "text" type= "id" name= "check=" ^s+$ " ID cannot be empty, and cannot contain spaces "/><br/> * <input type= "submit"/><br/> *</form> * AUTHOR:WANGHR100 (Grey bean baby. NET) * email:wanghr100@126.com * Update:19:28 2004-8-23 * Note: Be careful when writing regular expressions. Don't let "conscientious" have loopholes. * Implemented features: * Verify the legality of the Text,password,hidden,file,textarea,select,radio,checkbox * To be implemented function: the regular table to write a library. *---------------Common validation checkform (oform) for client forms----------------- */ //////////////////////////////////////////////////////////////////////////////// Main function function Checkform (oform) { var els = oform.elements; Traverse all table elements For (Var i=0;i<els:0013. length;i++) { Whether you need to verify if (Els[i].check) { Gets the regular string of validation var sreg = Els[i].check; Gets the value of the form, using the universal value function var sval = GetValue (Els[i]); String-> regular expression, case-insensitive var reg = new RegExp (Sreg, "I"); if (!reg.test (Sval)) { Validation does not pass, pop-up prompts warning alert (els[i].warning); This form element gets the focus, with the universal return function GoBack (Els[i]) return false; } } } } The universal value function is divided into three classes to take the value Text input box, direct value El.value Tando, traverse all options to get the number of selected returns the result "00" indicates that two are selected Single-Multiple Pull-down menu, traversing all options to get the selected number returns the result "0" indicates the selected function GetValue (EL) { To get the type of a FORM element var stype = El.type; Switch (stype) { Case "Text": Case "hidden": Case "Password": Case "File": Case "textarea": return el.value; Case "checkbox": Case "Radio": Return Getvaluechoose (EL); Case "Select-one": Case "Select-multiple": Return Getvaluesel (EL); } Get the number of Radio,checkbox selected, with "0" to indicate the number of selected, we write regular time can be passed 0{1,} to indicate the number of selected function Getvaluechoose (EL) { var svalue = ""; Gets the name of the first element and searches for this element group var tmpels = Document.getelementsbyname (el.name); For (Var i=0;i<tmpels:0012. length;i++) { if (tmpels[i].checked) { svalue + = "0"; } } return svalue; } Get the select number of select, with "0" to indicate the number of selected, we write the regular time can pass 0{1,} to indicate the number of selected function Getvaluesel (EL) { var svalue = ""; for (Var i=0;i<el.options.length;i++) { The Select Drop-down Box Prompt option is set to Value= "" if (el.options[i].selected && el.options[i].value!= "") { svalue + = "0"; } } return svalue; } } A universal return function that verifies the effect of not passing the return. Three classes to take the value Text input box, cursor positioned at end of text input box Tando, the first option gets the focus Single Multi Pull-down menu, get focus function GoBack (EL) { To get the type of a FORM element var stype = El.type; Switch (stype) { Case "Text": Case "hidden": Case "Password": Case "File": Case "textarea": El.focus (); var rng = El.createtextrange (); Rng.collapse (FALSE); Rng.select (); Case "checkbox": Case "Radio": var els = document.getelementsbyname (el.name); Els[0].focus (); Case "Select-one": Case "Select-multiple": El.focus (); } }

<script language= "JavaScript" src= "Check.js" ></script>

Common form function test:

The code is as follows

Copy Code

<form name= "Form1" onsubmit= "return Checkform (This)" >test:<input type= "text" name= "test"/> does not validate <br/ > account: <input type= "text" check= "^s+$" warning= "account cannot be empty and cannot contain spaces" name= "id"/> cannot be empty <br password:/> <input " Password "check=" S{6,} "warning=" password six-bit "name=" id "/> More than six <br/> Tel: <input type=" text "check=" ^d+$ "warning= "Phone numbers contain illegal characters" name= "number" value= ""/><br/> Photo upload: <input type= "File" check= "(. *) (. Jpg|. BMP) $ "warning=" photo should be jpg,bmp format "name=" Pic value= "1"/><br/> Date of birth: <input type= "text" check= "^d{4}-d{1,2" -d{1,2}$ "warning=" date format 2004-08-10 "name=" dt "value="/> Date format 2004-08-10<br/> province: <br/><select name= " Sel "check=" ^0$ "warning=" Please select your province > <option value= "" > Please Select </option><option value= "1" > Fujian Province </option><option value= "2" > Hubei Province </option></select><br/> Choose your favorite sport: <br/> Swimming <input type= "checkbox" Name= "C" check= "^0{2,}$" warning= "Please select 2 or more"/><br/> Basketball <input type= "checkbox" Name= "C"/><br/> Soccer <input type= "checkbox" Name= "C"/><br/> Volleyball <input type= "checkbox" Name= "C"/><br/> Your education: <br/> University <input type= "Radio" name= "R" check= "^0$" warning= "Please select a degree"/><br Middle School <input type= "Radio" name= "R"/><br/> Primary school <input type= "Radio" name= "R"/><br/> Personal Introduction: <br/><textarea name= "txts" check= "^[s|" s]{20,}$ "warning=" personal introduction can not be empty, and not less than 20 words "></textarea>20 more than a word <br/> <input type= "Submit"/></form>