Validate email address using jQuery

This is a very basic functionality to validate the email address. In this post, I will show you how to validate the email address using jQuery. To validate the email address, I have created a separate function which based on email address, returns true or false. Email address validation is done using regular expression.

Earlier I had posted about Validate Date format using jQuery, Validate Date using jQuery and Validate Phone numbers using jQuery. And in this post, find jQuery way to Validate email address.

The validateEmail() functions (created below) will accept a parameter which is nothing but the email address and using regex it validates the email address. If it is correct then it returns true, otherwise false.

1	function validateEmail(sEmail) {

2	var filter = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;

3	if (filter.test(sEmail)) {

4	return true;

5

}

6

else {

7	return false;

8

}

9

}​

One just need to make a call to this function to validate the email address. For demo, I have used on click event of button. But It can be used on blur event of textbox or any another event.

01	$(document).ready(function() {

02	$('#btnValidate').click(function() {

03	var sEmail = $('#txtEmail').val();

04	if ($.trim(sEmail).length == 0) {

05	alert('Please enter valid email address');

06	e.preventDefault();

07

}

08	if (validateEmail(sEmail)) {

09	alert('Email is valid');

10

}

11

else {

12	alert('Invalid Email Address');

13	e.preventDefault();

14

}

15

});

16

});

See result below.