Entrar ¿Aún no tienes acceso?
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
3
respuestas

[Duda] LA verdad este curso no he entendido mucho

Referente al curso JS en la Web: Validación de Formularios y HTML5, en el capítulo Validación de fechas y actividad Mejorando el código

por Graciela Collazos Osorio
| 150.2k xp | 159 posts
Coordinadora de Seguridad

Buenas noches a toda la comunidad, este tema donde se supone que es la base ha sido la más dificil de entender y la que se supone que es la especialización, que frustración, pienso que son conceptos complejos y deberia haber una explicación mas profunda , ya que la metodologia impartida es como si el instructor estuviera explicando el codigo a una persona que ya domina la programación. Señores Alura este tema ha sido un matadero según veo por los comentarios. Igualemente agradezco el esfuerzo. Hay dos conceptos en especial que me gustaria que por favor me explicaran (blur y target) según entendí blur es cuando pierde el foco pero entonces cual es la diferencia con focus? y target no lo tengo claro; respecto al resto de codigo no entendí nada. El instructor quito el codigo

const inputNacimiento = document.querySelector("#birth")
//evento blur, es cuando quita el foco de ese espacio o ese input
inputNacimiento.addEventListener("blur", (evento) => {
    validarNacimiento(evento.target);
});

ya no me valida si es menor de edad-

3 respuestas
por Rafaela Rocha
| 2876.2k xp | 8758 posts
Alura Scuba Team Scuba Team

¡Hola Graciela!

Lamento mucho que estés teniendo dificultades con este tema en el curso. Entiendo que puede ser frustrante cuando los conceptos no se explican de manera clara y profunda. Permíteme ayudarte a entender los conceptos de "blur" y "target".

En el contexto de la programación web, "blur" se refiere a un evento que ocurre cuando un elemento pierde el foco. Por ejemplo, si tienes un campo de texto y haces clic en otro lugar de la página, el campo de texto perderá el foco y se disparará el evento "blur". Esto puede ser útil para realizar validaciones o ejecutar ciertas acciones cuando el usuario deja de interactuar con un elemento.

Por otro lado, "target" se refiere al elemento específico que disparó un evento. En el código que compartiste, el evento "blur" está asociado al elemento con el id "birth" (un campo de fecha de nacimiento). Cuando este campo pierde el foco, se ejecuta la función "validarNacimiento" pasando como argumento el elemento que disparó el evento, es decir, el campo de fecha de nacimiento en este caso.

En cuanto a la validación de si es menor de edad, es posible que haya algún error en el código que no esté funcionando correctamente. Sin embargo, sin ver el resto del código y la función "validarNacimiento", es difícil determinar cuál podría ser el problema. Te sugiero revisar el código en busca de posibles errores o compartir más detalles para que podamos ayudarte de manera más precisa.

Recuerda que la programación puede ser desafiante, pero con práctica y paciencia, podrás comprender y dominar estos conceptos. ¡No te desanimes! Si tienes alguna otra pregunta o necesitas más ayuda, no dudes en preguntar.

¡Espero haber ayudado y buenos estudios!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios! :)
por Hugo Jeampierk Simón Contreras
| 85.5k xp | 3 posts

Hola, si aun no te deja validar puede que tengas el mismo error que yo, para solucionarlo lo que puedes hacer es asegurarte que tengas vinculados los dos scripts en el html y tambien agregarle type="module".

De esta manera:

por Graciela Collazos Osorio
| 150.2k xp | 159 posts
Coordinadora de Seguridad

Hola, mira parte de mi codigo archivo app.js

import { valida } from "./validaciones.js";

const inpust = document.querySelectorAll("input") // todos los elementos de tipo input
inpust.forEach(input => {
    input.addEventListener("blur", (input) => {
        valida(input.target);    
    })
});

Archivo registro.html

<input name="birth" id="birth" class="input" type="date" placeholder="Fecha de nacimento" required data-tipo="nacimento">
<script src = "./js/app.js" type = "module"></script>