Software School Projects | Academic Students Projects | Source Codes | Tablets header
Please use our contact us form or send email to Support@srishtis.com.

Live Email validation with jquery
First create the html page.
<div><input type="text" id="validate" width="30"><span id="validEmail"></span></div>
This creates a basic input text box for the email address.
Javascript
Create the function that checks the email address against a regular expression.
function isValidEmailAddress(emailAddress) {
var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
return pattern.test(emailAddress);
}
Stylesheet
<style> .#validEmail { margin-top: 4px; margin-left: 9px; position: absolute; width: 16px; height: 16px; } </style>
JQuery
The last part to this is obviously the jQuery to do the live validation. We hook up a keyup event to the input box we created in the HTML section. Within that event function, the jQuery calls the isValidEmailAddress function with the current value of the input box.f it returns a positive result (ie the email address is valid) then it will show a nice validyes icon. If not, it will display an validno icon. Lastly, it also hides the tick/cross images when the input box is cleared.
$(document).ready(function() { $("#validate").keyup(function() var email = $("#validate").val(); if(email != 0) { if(isValidEmailAddress(email)) { $("#validEmail").css({ "background-image": "url('validYes.png')" }); } else { $("#validEmail").css({ "background-image": "url('validNo.png')" }); } } else { $("#validEmail").css({ "background-image": "none" }); } }); });
 
 
 
 
 
Job or extra money for students

Search Engine Rank of your blog or websites