So in the previous development and slowly began to sum up, but also wrote a number of scattered methods to be relatively simple, write less code to complete more verification. The idea is to pass the parameters, the ID of the control to be validated to pass in, if you want to verify the data format and then pass the corresponding regular expression in. After the project is over, the whole project is summed up to find that this kind of writing also does not save how much code, and many places because the classmate response said I wrote that the library is not very good, although there are instructions, but they still can not very well understand, can not be quickly started, and should still have a lot of bugs, So in a lot of places they'd rather use that kind of one by one validation for each control, a JS file in the light to verify the part of the code to get two hundred or three hundred lines, and are more lazy, for the annotation is able to write less a sentence, so that the problem after the maintenance is also very troublesome, JS debugging also does not have a very convenient tool.
Recently also on business, free time I think, can be on the basis of the previous encapsulation more, and then call more convenient, it is best to call when not to write JS code best. Think of jquery's powerful selector, and often add some custom attributes to the page element when validating it or when you need to take a value from the page. As a matter of fact, when you want to do validation, you just need to add a few custom attributes to the element, call the JS code on the line, it should be the simplest.
This simple validation library should be able to perform 90% basic validation, including validation when the focus is lost, and when the Submit button is clicked. The back end of that I will not be able to do, can only be who used to write to himself:).
The first section of the code to call, JS Code said less also a lot of, it is not directly posted, the article later on the attachment, but also included a copy of my own before the plug-ins of the plug-in JS file.
Copy Code code as follows:
<script src= "Js/jquery-1.4.2.min.js" type= "Text/javascript" ></script>
<script src= "Js/ks.ext.msgbox.js" type= "Text/javascript" ></script>
<script src= "Js/validata.js" type= "Text/javascript" ></script>
<form name= "Form1" Id= "Form1" action= "#" method= "POST" >
E-mail: <input type= "text" id= "email" name= "email"
Validata= "Email" errormsg= "mailbox format is not correct" emptyerrormsg= mailbox cannot be empty "empty= false"/><br
Mobile: <input type= "text" name= "phone" validata= "phone"
errormsg= "mobile phone format is not correct" emptyerrormsg= "mobile phone can not be empty" empty= "true"/><br/>
Tel: <input type= "Text" name= "Tel" validata= "Tel"
errormsg= "phone format is not correct" emptyerrormsg= "phone cannot be empty" empty= "true"/><br/>
ID: <input type= "text" name= "Idcard" Validata= "Idcard" errormsg= "ID card format is incorrect"
Emptyerrormsg= "ID cannot be empty" empty= "false"/><br/>
Password: <input type= "password" name= "pwd" validata= "Empty"
Empty= "false" emptyerrormsg= "password cannot be empty"/><br/>
Confirm Password: <input type= "password" name= "pwd1" Validata= "Password2" errormsg= "Confirm password cannot be empty"
Diffmsg= "two times password input inconsistency"/><br/>
<input type= "Submit" id= "Submit1" value= "Submit"/>
</form>
For example, verify the mailbox:
Sometimes the mailbox we are allowed to empty, but once entered the mailbox is required mailbox is legal. If you allow null to give empty a value of true, then the validation library does not have non-null validation. If False or the empty attribute is not NULL by default, it is not allowed to be empty. A emptyerrormsg attribute that is not allowed to be empty is used to display an error message if it is empty, and if the property is missing or the value is empty, then a red "*" is displayed, and the value of the attribute is displayed if it is not empty. Then is the verification of the format, is to verify the mailbox, Validata is the value of email, if not legitimate to show another custom attribute errormsg value, errormsg if missing or empty display error message is red "*".
The value of the validata is still not fully customizable, and has been customized in JS. is to return a different regular expression based on the value of the Validata. The method is as follows, and then the optional Validata value is the Regname value of the following methods. It is OK for the user to be able to show it directly and add other expressions.
Copy Code code as follows:
Returns the corresponding regular expression based on the different validation content
function returnregstring (regname) {
if (regname = = "Email") {
return "^ ([a-za-z0-9_\.\-]) +\@ ([a-za-z0-9\-]) +\.) + ([a-za-z0-9]{2,4}) +$ "; Mailbox
else if (Regname = "Tel") {
Return "^ (86)? (-)? (0[0-9]{2,3})? (-)? ([0-9]{7,8}) (-)? ([0-9]{3,5})? $ "; Phone
else if (regname = "Phone") {
Return "^ (13[0-9]|15[0-9]|18[0-9]) ([0-9]{8}) $"; Cell phone
else if (Regname = = "Postcode") {
return "^ ([0-9]{6}) $"; Zip
else if (Regname = = "Number") {
Return "^ (0| ( [1-9]+[0-9]*)] (. [ 0-9]+)? $ "; Digital
else if (Regname = = "decimal") {
Return "^[0-9]+" ([.] [0-9]+)? $ "; Floating point
else if (regname = "Money") {
return "^ ([0-9]) $"; Currency
else if (Regname = = "website") {//URL
Return "(http://|https://) {0,1}[\w\/\.\?\&\=]+";
else if (regname = "Fax") {//Fax
Return ' ^[+]{0,1} ([0-9]) {1,3}[]? ([-]? (([0-9]) | []) {1,12}) +$ ";
else if (regname = "int") {//integer
Return "^ (-) {0,1}\d+$";
else if (Regname = = "Pint") {//positive integer
return "^\d+$";
else if (Regname = = "Nint") {//negative integer
return "^-\d+$";
else if (Regname = = "Nandl") {//number and letter
Return "[a-za-z0-9]";
else if (regname = = "Chinese") {//contains Chinese characters
Return "[\u4e00-\u9fa5]";
}
}
Nonsense not to say, the verification library has not been a very complete test, you will be interested in trial, if you find any problems or other better methods of improvement must please tell the younger brother. Although there must be ready-made and more mature JS verification library, but I want to write one out. Another screenshot, click on the button if not through the validation then the pop-up prompts which place failed to verify, the pop-up layer is my own previous copy of the simulation of the effects of human network pop-up layer effect.
