Events personalitzats amb jQuery

El disseny d’interfícies per a aplicacions d’escriptori, típicament s’ha fet a partir de la generació d’events per part d’uns elements i de la seva captura per part d’uns altres. En el projecte en el que estic a la feina, estem fent una nova arquitectura més modular. Algunes aplicacions web, ja comencen a tenir moltes propietats, i la programació dels events Click, Hover… són d’ús quotidià.

A vegades però, amb aquests events estàndards no n’hi ha prou, i és necessari programar events propis d’una component, per tal de que pugui ser llançat amb total independència des d’un altre component (i no haver de cridar una funció concreta). Per fer això jQuery ens dóna la solució.

Primer de tot veurem com generar un nou event:

1. $(‘#el_nostre_div’).bind(‘el_nostre_event’, function(){
2. alert(‘Acció del nostre event!’);
3. });

Per llançar aquest event des d’un altre component podem fer:

1. $(‘body’).trigger(‘el_nostre_event’);

Finalment, a vegades ens pot interessar eliminar un event que havíem programat:

1. $(‘#el_nostre_div’).unbind(‘el_nostre_event’);

Amb aquestes tres porcions de codi, ja podem generar, llançar i eliminar events personalitzats i generar interfícies tal i com es fa amb les aplicacions d’escriptori però en el món web.

Tags: events, JavaScript, jQuery, Programació

Articles relacionats

Deck.js – Presentacions en HTML5

OOCSS (2a part), profunditzant en els widgets

OOCSS, Object-Oriented CSS

Web service amb PHP i NuSOAP

Less Framework 2