-1

Me tira error porque el id email es null el error es el siguiente : " index.html?email=:31 Uncaught TypeError: email1.includes is not a function at enviarForm (index.html?email=:31) at HTMLInputElement.onclick (index.html?email=:31) "

<script>
 let email1 = document.getElementsByName("email")
console.log(email1)

function enviarForm(){
if(email1.includes("@") ){
    alert("Email ingresado correctamente");
} else if (email.includes(" ") ) {
    alert("No escribas el correo con espacios vacios")
} 
else {
    alert("Revisa que no te falte el @")
}
} 
</script>
<form action="" class="form">
  <input type="email" name="email" id="email" placeholder="Your email adress..." >
 <input type="submit" value="Notify Me" class="button" onclick="enviarForm()"> 
</form>
1
  • 1
    Hola, Arturo. Recuerda que el código se comparte como texto. Así mismo, incluye en tus preguntas el error completo (para que sepamos un poco más sobre lo que sucede). Y sobre tu error, posiblemente quieras acceder al .value del elemento. email1 es una referencia a ese nodo en el DOM, así que no va a tener método includes.
    – Alfabravo
    el 19 nov. 2020 a las 22:56

2 respuestas 2

1

Lo que esta pasando es que el metodo getElementById devuelve un objeto de nodo del DOM que representa al nodo en si y estas empleando un metodo que no pertece al prototipo.

En resumen document.getElementById("email").includes("foo") no existe, por lo que tendras un error.

El metodo includes pertence solo al prototipo de array y string.

Para obtener el valor de un nodo como el imput tienes que utilizar la propiedad .value del objeto/elemnto:

let foo = document.getElementById("email").value;

La variable foo ahora es un string con el cual si puedes utilizar el metodo includes.

Despues de eso, para ayudarte con la pregunta, te recomiendo utilizar una expresión regular para evaluar el string:

let exp = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/

let reg = new RegExp(exp, "i")

let email = "[email protected]"

console.log(reg.test(email))

email = "myemail gmail.com"

console.log(reg.test(email))

email = "myemail@gmail|com"

console.log(reg.test(email))

Es mucho mejor utilizar expresiones regulares para validar datos ya que puedes evadir muchos fallos con una logica mas simple.

Implementando el codigo basado en tu ejemplo:

let email = document.querySelector("#email"),
send = document.querySelector("#send");

const sendEmail = () => {
  let exp = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/
  let reg = new RegExp(exp, "i")
  let value = email.value;
  if (!reg.test(value)) return alert("Parece que ingresaste un email no valido.") 
  alert("Enviado")
}

send.addEventListener("click", sendEmail);
<input type="email" id="email">
<button id="send" >Enviar</button>

Espero que te sirva de ayuda.

Aca te dejo algunos links utiles:

1

Tu problema radica en que tu variable email1 es un objeto/elemento HTML el cual carece de la funcion includes.

 let email1 = document.getElementsByName("email")

Para validar si contiene o no un @ primero debes acceder al texto de este

let email1 = document.getElementsByName("email")

function enviarForm(){
if(email1.value.includes("@") ){
    alert("Email ingresado correctamente");
} else if (email.includes(" ") ) {
    alert("No escribas el correo con espacios vacios")
} 
else {
    alert("Revisa que no te falte el @")
}
} 

Aunque cinseramente considero que es mejor validar con una expresion regular

/^\w+([.+-]?\w+)*@[a-z0-9]+([-_]{1,2})?([a-z]*)(\.[a-z]{2,15})+$/.test(email1.value)

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

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