Scriptia. Javascript y buenas prácticas en español



Scriptia / Etiquetas / eventos

Saltar a Acerca de Scriptia

Estás viendo la página para la etiqueta (o conjunto de etiquetas) eventos.

Keypress, apilado de eventos, control de valores y setTimeout

Algo que me han preguntado hoy:

Choan, cariño mío, guapetón de mi alma… tengo dos campos en un formulario y quiero que uno refleje los cambios en el otro… y controlando keypress no tengo el valor actualizado

Pues no, no lo tienes. Solución: controlar la pila de ejecución. El truco: usar un timeout para que el método que actualiza los valores se ejecute después de acabar con la gestión de eventos. Algo así:

// en el manejador del evento keypress
setTimeout(updateValue, 0); // <-- la clave está en el cero

Ahora bien, lo de recoger el valor actualizado basándonos en keypress no es suficiente, porque hay mil maneras de rellenar el campo sin pulsar una tecla (copipegar por menús, lectores de códigos de barras, yo-que-sés…)

Así que mi consejo es defenderse controlando también el evento blur. Lo pongo en términos de jQuery, suponiendo que el campo que controlamos lleva el identificador source y el de destino es conocido como destination.

(function($) {

  var init_copy_values = function() {
    $('#source').bind('keypress blur', function(e) {
      if (e.type == 'keypress') setTimeout(updateValue, 0);
      else updateValue();
    });
  },
  updateValue = function() {
    $('#destination').val($('#source').val());
  };

  $(init_copy_values);

}(jQuery));

Pues nada, ya está, un post sin insultar a nadie.

Eventos en jQuery 1.2

Días ha que escribí una nota sobre los eventos en jQuery. Y hora es de ampliar dicho artículo con las novedades que la serie 1.2 de jQuery añade al respecto.

Continúa leyendo Eventos en jQuery 1.2

Ajax, eventos y jQuery

Un «problema» con el que todo novato de la programación con jQuery se encuentra tarde o temprano (y las listas de correo lo demuestran) es que el contenido cargado (o generado) dinámicamente no dispara los manejadores de eventos asignados en $(document).ready.

Continúa leyendo Ajax, eventos y jQuery

Los locos locos eventos de teclado

En lo que hace a eventos, los navegadores suelen ir a su bola. Y en lo que hace a eventos de teclado, el caos es absoluto: hay quien notifica las teclas modificadores en keypress, hay quien no; cada navegador es un mundo en cuanto a códigos de tecla… y dos o tres pesadillas más.

En JavaScript Madness: Keyboard Events, Jan Wolter documenta para uso y disfrute público todas las divergencias que se va encontrando.

onbeforeunload: tiende una mano al usuario

¿Alguna vez has cerrado una ventana cuando tenías un formulario a medio rellenar? ¿Has invertido media hora en escribir un email y, por error, has abandonado la página sin enviarlo? Evita a tus usuarios pasar por este trauma –y el de aprender hebreo– usando onbeforeunload. Continúa leyendo onbeforeunload: tiende una mano al usuario

Eventos en jQuery

Presentamos un repaso en profundidad a los métodos de jQuery relacionados con el trabajo con eventos: asignación, manejo (`this` y `target`), desligado de manejadores, disparo _artificial_ de eventos, atajos y buen humor. Continúa leyendo Eventos en jQuery

Referencia de eventos DOM en la Wikipedia

Eventos DOM –estándares y propietarios– correctamente descritos en DOM events (Wikipedia).

Acerca de Scriptia

Saltar a la caja de búsqueda

Scriptia forma parte del PDM de Choan C. Gálvez, desarrollador web residente en Barcelona. Scriptia pretende mejorar la calidad de la documentación acerca de javascript disponible en español.