In this article, we will learn how to validate an email address using Jquery.
Here is the code to validate an email address using jquery.
<html>
<head>
<title>Email Validator using Jquery - Tutorialsrack.com</title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
</head>
<body>
<h1>Email Validator using Jquery</h1>
<label>Email</label>
<input type="text" id="txt_email" placeholder="Enter Email Id">
<input type="button" id="btn_Validate_email" value="Validate Email">
<label id="message" style="font-weight:bold;"></label>
<script>
function validateEmail(email) {
var reg = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return reg.test(String(email).toLowerCase());
}
$('#btn_Validate_email').on('click', function () {
var txt_value = $('#txt_email').val();
if (validateEmail(txt_value) === true) {
$('#message').text("Email is Valid");
$('#message').css("color", "Green");
}
else {
$('#message').text("Email is Invalid");
$('#message').css("color", "Red");
}
});
</script>
</body>
</html>I hope this article will help you to understand how to validate an email address in Jquery.
Share your valuable feedback and help us to improve. If you find anything incorrect, or you want to share more information about the topic discussed above. please post your comment at the bottom of this article. Thank you!
Comments