Home > Developer > Web Develop
Simply use jquery's Validate
--@ Beam WP
Absrtact: This article explains the most basic usage of jquery validate through a very simple example.
First, the source code
Notes are written in the comments of the code, haha.
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "UTF-8"><title>Lwp</title><!--jquery, must -<Scripttype= "Text/javascript"src= "Jquery-1.11.2.js"></Script><!--the checksum of jquery must be -<Scripttype= "Text/javascript"src= "Jquery.validate.js"></Script><!--additional download of the checksum rule Daquan, optional -<Scripttype= "Text/javascript"src= "Additional-methods.js"></Script><Script> $(function() { /*To make the form use jquery-validate verification, you must*/ $("form"). Validate (); /*Overwrite jquery-validate original English hint in Chinese, optional*/Jquery.extend (jQuery.validator.messages, {required:"cannot be empty", Email:"Please enter a formal email" }); /*Custom Check rules, optional*/JQuery.validator.addMethod ("LWP", function(value, Element) {if(Value== "" ||value== "Liang") { return true; } Else { return false; } }, "only Input Liang"); }); functionCheck () {/*Check Forms*/ if($("form"). Valid ()) {alert ("Submit Success"); } Else { return false; } }</Script><style>/*custom error style, override Jquery-validate's own error style, optional*/Label.error{Color:#F00;font-size:12px;}</style></Head><Body> <form> <Div> <label for= "Email">Mailbox</label> <!--required and e-mails are Jquery-validate's own check rules - <inputtype= "text"AutoComplete= "Off"name= "Email"Required= "true"Email= "true"> </Div> <Div> <label for= "Author">Author</label> <!--LWP is a self-defined validation rule - <inputtype= "text"AutoComplete= "Off"name= "Author"Required= "true"LWP= "true"> </Div> <Div> <inputtype= "button"onclick= "check ();"value= "Submit"> </Div> </form></Body></HTML>
Ii. Results
1, the required check, as follows:
2, email and LWP verification, as follows:
3, the verification after the submission, as follows:
Simply use jquery's Validate
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
