Email Validation in jQuery

Question

I have used below code and it working fine please check below.

$(".emailValidation").change(function(){

    $('body .emailError').remove();
    var emailVal = this.value;
    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    if(filter.test(emailVal) === false)
    {
        $( ".emailValidation" ).after( "<div class='emailError'>You have added wrong email address.</div>" );
    }
    else 
    {
        $('.emailError').remove();
    }

});

But if user pass email@email.com.com then this validation is not working.

email@email.com.com is a valid email address. Does the validation reject it and you want it to pass, or does it accept it and you want it to be rejected? — JJJ, Apr 12 '16 at 08:28
@Juhana the validation regex would pass email@email.com.com, which—as you said—is a valid address. — Lochlan, Apr 12 '16 at 08:28
@Juhana i need only email@email.com email address and if user pass any other string then it will reject. — Pritesh Mahajan, Apr 12 '16 at 08:30
Well, if you really want to disallow valid addresses, you can move the `\.` to right after `+`, but you're going to make some disgruntled users. The regex rejects other valid addresses also. — JJJ, Apr 12 '16 at 08:32
Possible duplicate of [Using a regular expression to validate an email address](http://stackoverflow.com/questions/201323/using-a-regular-expression-to-validate-an-email-address) — Matthew Herbst, Apr 12 '16 at 08:33

score -1 · Answer 1 · answered Apr 12 '16 at 08:33

Try this regular expression, it works every time.

/^[-a-z0-9~!$%^&_=+}{\'?]+(.[-a-z0-9~!$%^&_=+}{\'?]+)@([a-z0-9_][-a-z0-9_](.[-a-z0-9_]+)*.(aero|arpa|biz|com|coop|edu|gov|info|int|mil|museum|name|net|org|pro|travel|mobi|[a-z][a-z])|([0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}))(:[0-9]{1,5})?$/i

Try the code snippet !!!

$('form input[name="email"]').keyup(function () {
    var email = $(this).val();
var re = /^[-a-z0-9~!$%^&*_=+}{\'?]+(\.[-a-z0-9~!$%^&*_=+}{\'?]+)*@([a-z0-9_][-a-z0-9_]*(\.[-a-z0-9_]+)*\.(aero|arpa|biz|com|coop|edu|gov|info|int|mil|museum|name|net|org|pro|travel|mobi|[a-z][a-z])|([0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}))(:[0-9]{1,5})?$/i;
if (re.test(email)) {
    $('.msg').hide();
    $('.success').show();
} else {
    $('.msg').hide();
    $('.error').show();
}

});

.msg {
    display: none;
}
.error {
    color: red;
}
.success {
    color: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form method="post">
    <div>
        <label for="email" id="email-ariaLabel">Your email address:</label>
        <input id="email" name="email" type="email" class="required" title="This is a required field" /> <span class="msg error">Not a valid email address</span>
       <span class="msg success">A valid email address!</span>

    </div>
</form>

Rahul Soni · Answer 2 · 2016-04-13T08:36:46.013

Please try with below code. This is running for:


    stack@overflow@gmail.com
    stack@overflow@gmail.com.com
    stackoverflow.com@gmail.com


         $(".emailValidation").change(function(){

            $('body .emailError').remove();
            var emailVal = this.value;
            var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
            if (emailVal.indexOf("@") >= 0){
              var emailExt = emailVal.split('@'); 
              var extCount = (emailExt[1].match(/.com/g) || []).length;
            }        

            if(filter.test(emailVal) === false || extCount>1)
            {
                $( ".emailValidation" ).after(   "You have added wrong email address." );
                console.log("wrong email id")
            }
            else if(extCount === 1)
            {
                $('.emailError').remove();
                console.log("Email is correct");
            }
      });

@JoomlaDeveloper: Please try above code and vote up if it works for you :) — Rahul Soni, Apr 13 '16 at 07:22

Email Validation in jQuery

2 Answers2