3

En HTML lo tengo así no sé de que forma validarlo ya que no quiero hacerlo por el type="email"

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

5
  • no entiendo esa forma Commented el 20 jun. 2017 a las 18:37
  • ¿No entiendes JavaScript?
    – Shaz
    Commented el 20 jun. 2017 a las 18:41
  • osea si ya he usado javascript para validar pero bueno intente usar esa forma que sale en el enlace que pusistes pero no me sirvio y quisiera saber como puedo aplicarselo a mi input Commented el 20 jun. 2017 a las 18:43
  • Pues la respuesta a esta pregunta ya existe, es con JavaScript y y una expresión regular.
    – M. Gress
    Commented el 20 jun. 2017 a las 18:48
  • pero vaya yo se que tengo que mandar llamar el archivo js ... y la función donde debo mandarla a llamar? Commented el 20 jun. 2017 a las 18:50

1 respuesta 1

-2

Basado en lo que se ha respondido previamente aqui (ya que comentas que no te queda claro como podrias hacerlo), te lo explicare de otra manera acerca de como podrias hacerlo:

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>

Primero

Creamos una funcion llamada validarEmail(), a la que le pasaremos como parametro el elemento HTML, que corresponda al <input> donde se escribira el Correo Electronico. En esta funcion se validara el texto usando una expresion regular.

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 = "";
  }

}

Segundo

Desde el elemento <input> agregaremos el evento onkeyup(), el cual se ejecutara cada que se presione una tecla.

onkeyup="validarEmail(this)"

Tercero

Creamos un elemento de tipo <a> el cual tendra como identificador la palabra resultado, y desde la funcion validarEmail(), cambiaremos el texto de este dependiendo de la validacion del Correo Electronico.

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

Ejemplo

<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>

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.