JavaScript

Responde a eventos de formulario

Puedes usar JavaScript para responder a las interacciones de los usuarios en tu formulario, revelar campos adicionales, enviar un formulario y mucho más.

Ayuda a los usuarios a completar controles de formulario adicionales

Imagina que creaste un formulario de encuesta. Después de que un usuario selecciona una opción, querrás mostrar un <input> adicional para hacer una pregunta específica relacionada con la selección. ¿Cómo puedes mostrar solo el elemento <input> relevante?

Puedes usar JavaScript para revelar un <input> solo cuando el <input type="radio"> asociado está seleccionado actualmente.

if (event.target.checked) {
    // show additional field
} else {
   // hide additional field
}

Veamos el código JavaScript de la demostración. ¿Notaste los atributos aria-controls y aria-expanded? Usa estos atributos ARIA para ayudar a los usuarios de lectores de pantalla a comprender cuándo se muestra o se oculta un control de formulario adicional.

Asegúrate de que los usuarios puedan enviar un formulario sin salir de una página

Imagina que tienes un formulario de comentarios. Cuando un lector agrega un comentario y envía el formulario, lo ideal sería que pudiera ver el comentario de inmediato sin tener que actualizar la página.

Para lograrlo, escucha el evento onsubmit, usa event.preventDefault() para evitar el comportamiento predeterminado y envía el FormData con la API de Fetch.

Browser Support

  • Chrome: 42.
  • Edge: 14.
  • Firefox: 39.
  • Safari: 10.1.

Source