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



Acerca de Scriptia

Saltar a Anotaciones recientes

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.


Anotaciones recientes

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.


Vilaweb y el desarrollador tonto del haba

Me cuentan por ahí que hoy se ha lanzado la nueva versión de Vilaweb. El culmen de las buenas prácticas en marcado HTML (sí, es sarcasmo).

Atención al siguiente fragmento, extraído del tal sitio el 24 de noviembre de 2009:

<div class="zona-imatge">
  <img alt="Detingut el batlle de Polop per la mort del seu predecessor&lt;br/&gt;" src="/media/portada/81/1259046000.jpg" width="299" height="254"/>
  <div class="params" style="display: none">
    <div class="w">299</div>
    <div class="h">254</div>
    <div class="file">/media/portada/81/1259046000.jpg</div>
  </div>
</div>

Mi comentario (versión breve): imbécil.

Mi comentario (versión extendida): eres tan tonto que cada vez que te documentas, en lugar de mejorar empeoras. ¿Qué demonios hacen esos «parámetros» metiendo ruido en el HTML? ¿Se te ha ocurrido, por ventura, aplicar un tipo de «no intrusividad» parida por tu genial cerebro?

Supongo que estarás pensando: ya te vale, Choan, despotricas y no dices nada. Así es, en efecto. Si sabes lo que está mal (fatal, punible con muerte) en ese pedazo de código no hace falta que te cuente nada. Y si no lo sabes, sigue en tu santa ignorancia, busca una multinacional en la que triunfar como un programador mediocre y haz que tu madre se sienta orgullosa de ti. Cretino.

(Hay otras perlas, pero la que más ganas me ha dado de ponerme faltón ha sido esta. Y sí, el diseño también me parece una mierda.)