Validate email address textbox using JavaScript

Question

I have a requirement to validate an email address entered  when a user comes out from the textbox  I have googled for this but I got form validation JScript  I don t want form validation  I want textbox validation  I have written below JScript but  if email invalid it s not returning the same page     function validate email                 var reg       A-Za-z0-9  -         A-Za-z0-9  -         A-Za-z  2 4                    var address   document getElementById email  value              if  reg test email     false                                 alert  Invalid Email Address                    return  false

User · Answer

Validating email is a very important point while validating an HTML form. In this page we have discussed how to validate an email using JavaScript :

An email is a string (a subset of ASCII characters) separated into two parts by @ symbol. a "personal_info" and a domain, that is personal_info@domain. The length of the personal_info part may be up to 64 characters long and domain name may be up to 253 characters. The personal_info part contains the following ASCII characters.

Uppercase (A-Z) and lowercase (a-z) English letters.
Digits (0-9).
Characters ! # $ % & ' * + - / = ? ^ _ ` { | } ~
Character . ( period, dot or fullstop) provided that it is not the first or last character and it will not come one after the other.

The domain name [for example com, org, net, in, us, info] part contains letters, digits, hyphens, and dots.

Example of valid email id

[email protected]

Example of invalid email id

mysite.ourearth.com [@ is not present]

[email protected] [ tld (Top Level domain) can not start with dot "." ]

@you.me.net [ No character before @ ]

[email protected] [ ".b" is not a valid tld ]

[email protected] [ tld can not start with dot "." ]

[email protected] [ an email should not be start with "." ]

mysite()*@gmail.com [ here the regular expression only allows character, digit, underscore, and dash ]

[email protected] [double dots are not allowed]

JavaScript code to validate an email id

function ValidateEmail(mail) {
        if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w {2, 3})+$/.test(myForm.emailAddr.value)) {
            return (true)
        }
        alert("You have entered an invalid email address!")
        return (false)
    }

User · Answer

lt h2 gt JavaScript Email Validation lt  h2 gt    lt input id  textEmail  gt    lt button type  button  onclick  myFunction    gt Submit lt  button gt    lt p id  demo  style  color  red   gt  lt  p gt    lt script gt  function myFunction         var email       email   document getElementById  textEmail   value           var reg       A-Za-z0-9  -         A-Za-z0-9  -         A-Za-z  2 4               if  reg test textEmail value     false                     document getElementById  demo   style color    red               document getElementById  demo   innerHTML   Invalid EMail - gt    email              alert  Invalid Email Address - gt   email               return false            else          document getElementById  demo   style color    DarkGreen                 document getElementById  demo   innerHTML   Valid Email - gt   email                return true     lt  script gt

User · Answer

If you wish to allow accent  see RFC 5322  and allow new domain extension like  quebec  use this expression     b a-zA-Z0-9 u00C0- u017F    -    a-zA-Z0-9 u00C0- u017F -     a-zA-Z  2   b     The   u00C0- u017F  part is for alowing accent  We use the unicode range for that  The   2    simply say a minimum of 2 char for the domain extension  You can replace this by   2 63   if you dont like the infinitive range    Based on this article  JsFidler  x000D   x000D    document  ready function     x000D  var input       input field    x000D  var result       test result    x000D          var regExpression     b a-zA-Z0-9 u00C0- u017F    -    a-zA-Z0-9 u00C0- u017F -     a-zA-Z  2   b   x000D       x000D         btnTest   click function    x000D            var isValid   regExpression test input val     x000D            if  isValid  x000D                result html   lt span style  color green   gt This email is valid lt  span gt     x000D             else x000D                result html   lt span style  color red   gt This email is not valid lt  span gt     x000D   x000D         x000D   x000D      x000D  body   x000D      padding  40px  x000D    x000D   x000D  label   x000D      font-weight  bold  x000D    x000D   x000D  input type text    x000D      width  20em x000D    x000D   test result   x000D    font-size 4em  x000D    x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 1 jquery min js  gt  lt  script gt  x000D   lt label for  search field  gt Input lt  label gt  x000D   lt input type  text  class  input field    gt  x000D   lt button type  button  class  btnTest  gt  x000D  Test x000D   lt  button gt  x000D   lt br  gt  x000D   lt div class  test result  gt  x000D  Not Tested x000D   lt  div gt  x000D   x000D   x000D

User · Answer

lt  DOCTYPE html gt       lt html gt       lt body gt        lt h2 gt JavaScript Email Validation lt  h2 gt        lt input id  textEmail  gt        lt button type  button  onclick  myFunction    gt Submit lt  button gt        lt p id  demo  style  color  red   gt  lt  p gt        lt script gt      function myFunction             var email           email   document getElementById  textEmail   value               var reg       A-Za-z0-9  -         A-Za-z0-9  -         A-Za-z  2 4                   if  reg test textEmail value     false                             document getElementById  demo   style color    red                   document getElementById  demo   innerHTML   Invalid EMail - gt    email                  alert  Invalid Email Address - gt   email                   return false                else              document getElementById  demo   style color    DarkGreen                     document getElementById  demo   innerHTML   Valid Email - gt   email                        return true             lt  script gt        lt  body gt       lt  html gt

User · Answer

function validateEmail email         var re          lt  gt             s           lt  gt             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 re test email        To validate email id in javascript above code works

User · Answer

The result in isEmailValid can be used to test whether the email s syntax is valid   var validEmailRegEx      A-Z0-9                amp  -        A-Z0-9                amp  -      A-Z0-9-      A-Z0-9-      i var isEmailValid   validEmailRegEx test  Email To Test

User · Answer

Assuming your regular expression is correct   inside your script tags  function validateEmail emailField           var reg       A-Za-z0-9  -         A-Za-z0-9  -         A-Za-z  2 4               if  reg test emailField value     false                         alert  Invalid Email Address                return false                     return true       in your textfield    lt input type  text  onblur  validateEmail this      gt

User · Answer

This is quite an old question so I ve updated this answer to take the HTML 5 email type into account   You don t actually need JavaScript for this at all with HTML 5  just use the email input type    lt input type  email    gt     If you want to make it mandatory  you can add the required parameter  If you want to add additional RegEx validation  limit to  foo com email addresses for example   you can use the pattern parameter  e g     lt input type  email  pattern     foo com    gt     There s more information available on MozDev    Original answer follows    First off - I d recommend the email validator RegEx from Hexillion  http   hexillion com samples   It s pretty comprehensive -          w          amp        -                          w          amp        -                               a-zA-Z0-9     a-zA-Z0-9 -         0 61  a-zA-Z0-9       a-zA-Z0-9     a-zA-Z0-9 -        0 61  a-zA-Z0-9                01   d 1 2  2 0-4  d 25 0-5      3     01   d 1 2  2 0-4  d 25 0-5          I think you want a function in your JavaScript like   function validateEmail sEmail      var reEmail          w          amp        -                          w          amp        -                               a-zA-Z0-9     a-zA-Z0-9 -         0 61  a-zA-Z0-9       a-zA-Z0-9     a-zA-Z0-9 -        0 61  a-zA-Z0-9                01   d 1 2  2 0-4  d 25 0-5      3     01   d 1 2  2 0-4  d 25 0-5             if  sEmail match reEmail         alert  Invalid email address        return false         return true       In the HTML input you need to trigger the event with an onblur - the easy way to do this is to simply add something like    lt input type  text  name  email  onblur  validateEmail this value      gt    Of course that s lacking some sanity checks and won t do domain verification  that has to be done server side  - but it should give you a pretty solid JS email format verifier   Note  I tend to use the match   string method rather than the test   RegExp method but it shouldn t make any difference

User · Answer

You should use below regex which have tested all possible email combination       function validate email                var reg      a-zA-Z0-9       a-zA-Z0-9      a-zA-Z0-9-      a-zA-Z0-9-        a-zA-Z  2 15                    var address   document getElementById email  value              if  reg test email     false                                 alert  Invalid Email Address                    return  false                            Bonus tip if you re using this in Input tag than you can directly add the regex in that tag  example    lt input type  text           name  email          class  form-control         placeholder  Email          required         pattern    a-zA-Z0-9       a-zA-Z0-9      a-zA-Z0-9-      a-zA-Z0-9-        a-zA-Z  2 15      gt    Above you can see two attribute required  amp  pattern in   required make sure it input block have data  time of submit  amp  pattern make sure it input tag validate based in pattern regex   time of submit  For more info you can go throw doc

User · Answer

Are you also validating server-side   This is very important   Using regular expressions for e-mail isn t considered best practice since it s almost impossible to properly encapsulate all of the standards surrounding email   If you do have to use regular expressions I ll usually go down the route of something like             which basically checks you have a value that contains an     You would then back that up with verification by sending an e-mail to that address   Any other kind of regex means you risk turning down completely valid e-mail addresses   other than that I agree with the answer provided by  Ben

[javascript] Validate email address textbox using JavaScript

Examples related to javascript