<!DOCTYPE HTML><HTML> <Head> <title>Form validation</title> <Scriptsrc=".. /scripts/jquery-1.9.1.js "type= "Text/javascript"></Script> <Scripttype= "Text/javascript"> $(function(){ $("form:input.required"). each (function(){ var$required= $("<strong class= ' High ' >*</strong>"); $( This). Parent (). append ($required); }); $("input"). Blur (function(){ var$parent= $( This). parent (); if($( This). Is ("#username") {$parent. Find (". Formtips"). Remove (); if( This. Value==""|| This. Value.length<6){ varerrormsg= "Please enter a user name of at least 6 digits."; $parent. Append ('<span class= "Formtips onError" >'+errormsg+'</span>');
$ (this). After (errormsg); }Else{ varokmsg= "input is correct."; $parent. Append ('<span class= "Formtips onsuccess" >'+okmsg+'</span>'); } } }); $("#send"). Click (function(){ $("form. Required:input"). Trigger ("Blur"); varNumerror= $('form. OnError'). length; if(numerror) {//any number other than 0, like 1-1, is considered to be true. return false; } alert (Numerror); }) }); </Script> </Head> <Body> <formMethod= "POST"Action=""> <Divclass= "int"> <label for= "username">User name: </label> <inputtype= "text"ID= "username"class= "Required" /> </Div> <Divclass= "int"> <label for= "Email">Mailbox: </label> <inputtype= "text"ID= "Email"class= "Required" /> </Div> <Divclass= "int"> <label for= "Persioninfo">Personal information:</label> <inputtype= "text"ID= "Persioninfo"class= "Required" /> </Div> <Divclass= "Sub"> <inputtype= "Submit"ID= "Send"value= "Submit"/> <inputtype= "Reset"ID= "res"/> </Div> </form> </Body></HTML>
jquery Simple front-end form validation