Home / Questions / 80178
Accepted
Carlos Bonilla
Asked: 2020-06-21 10:36:19 +0800 CST 2020-06-21 10:36:19 +0800 CST

How to validate mail in javascript [duplicate]

  • 772

In HTMLI have it like this I don't know how to validate it since I don't want to do it for thetype="email"

<input class="input-100" type="email" name="email" placeholder="[email protected] " maxlength="39" id="email">

javascript

1 Answers

  1. Best Answer

    Based on what has been previously answered here (since you comment that it is not clear to you how you could do it), I will explain it to you in another way about how you could do it:

    function validarEmail(elemento){

  var texto = document.getElementById(elemento.id).value;
  var regex = /^[-\w.%+]{1,64}@(?:[A-Z0-9-]{1,63}\.){1,125}[A-Z]{2,63}$/i;
  
  if (!regex.test(texto)) {
      document.getElementById("resultado").innerHTML = "Correo invalido";
  } else {
    document.getElementById("resultado").innerHTML = "";
  }

}
    <input type="text" id="email" name="email" placeholder="Correo Electronico" onkeyup="validarEmail(this)">
<a id='resultado'></a>

    First

    We create a function called validarEmail(), to which we will pass the HTML element as a parameter, which corresponds to the <input>one where the Email will be written. In this function the text will be validated using a regular expression.

    function validarEmail(elemento){

  var texto = document.getElementById(elemento.id).value;
  var regex = /^[-\w.%+]{1,64}@(?:[A-Z0-9-]{1,63}\.){1,125}[A-Z]{2,63}$/i;

  if (!regex.test(texto)) {
      document.getElementById("resultado").innerHTML = "Correo invalido";
  } else {
    document.getElementById("resultado").innerHTML = "";
  }

}

    Second

    From the element <input>we will add the event onkeyup(), which will be executed every time a key is pressed .

    onkeyup="validarEmail(this)"

    Third

    We create a type element <a>which will have the word result as identifier , and from the function validarEmail(), we will change its text depending on the validation of the Email.

    <a id='resultado'></a>

    Example

    <html>
<head>
    <title>
        Titulo
    </title>
    <script type="text/javascript">
        function validarEmail(elemento) {

            var texto = document.getElementById(elemento.id).value;
            var regex = /^[-\w.%+]{1,64}@(?:[A-Z0-9-]{1,63}\.){1,125}[A-Z]{2,63}$/i;

            if (!regex.test(texto)) {
                document.getElementById("resultado").innerHTML = "Correo invalido";
            } else {
                document.getElementById("resultado").innerHTML = "";
            }

        }
    </script>
</head>
<body>

    <input type="text" id="email" name="email" placeholder="Correo Electronico" onkeyup="validarEmail(this)">
    <a id='resultado'></a>

</body>
</html>
    • -2