debug_mode=ON

Buscar en

 
 

Escribir un plugin para jQuery (3 parte)

Escrito por Indigo hace 1 meses . © Todos los derechos reservados
199 visitas. Etiquetas: javascript, jquery, plugin

Este artículo está disponible en microcode.es en el artículo titulado Escribir un plugin para jQuery (3 parte)

En mis anteriores artículos (Escribir un plugin para jQuery parte 1 y parte 2) sobre desarrollar un plugin para jQuery hemos visto como crear un plugin básico y como configurarlo dinámicamente. En esta ocasión vamos a ver como podemos disparar nuestros propios eventos y por ejemplo, que otro plugin actue en consecuencia.

Para esto vamos a seguir con el plugin que hemos desarrollado y que sirve para cambiar el estilo de nuestras cajas de texto cuando ésta tiene el foco y lo pierde.

Para usar eventos necesitamos tres cosas, el evento en si mismo (click, blur, focus), algo que lo lance y alguien que lo maneje (delegado). En jQuery el encargado de lanzar un evento es el método trigger y se hace de la siguiente manera

$(this).trigger('nombre_de_mi_evento', parametros_de_mi_evento);

Para manejar un evento se usa el método bind de la siguiente manera

$(this).bind(nombre_de_mi_eveto, function(e, data) {
// Código de la función que manejera mi evento. En la variable data tenemos los parameotros que hemos enviado en el trigger.
});

Aplicado esto a nuestro plugin, lo primero que haremos será crear un div donde iremos escribiendo todos lo eventos que vayamos manejando

<div id="status"></div>

y en nuestro fichero common.js pondremos los delegados

$('input').bind('myfocus', function(e, data) {
   var html = $('#status').html();
   html += 'onfocus<br />';
   $('#status').html(html);
});

$('input').bind('myblur', function(e, data) {
   var html = $('#status').html();
   html += 'onblur<br />';
   $('#status').html(html);
});

Luego sólo tendremos que modificar nuestro plugin para que lance los eventos

 $(this).focus(function() {
     //...
    $(this).trigger('myfocus', "on focus");
    //...
 });
 $(this).blur(function() {
    //...
    $(this).trigger('myblur', "on blur");
    //...
 });

Con esto ya tendríamos nuestros propios eventos myfocus y myblur gestionados.

Este artículo está disponible en microcode.es en el artículo titulado Escribir un plugin para jQuery (3 parte)

 

¡Votalo! 3 votos
¡Compártelo!

        

&nbps;

&nbps;

Indigo

Sobre Indigo

Hola, mi nombre es Indigo, comencé con el Framework 1.0 y hasta la fecha (aunque a las 3.5 no le he podido dedicar todo el tiempo que me gustaría).

 
Regístrate o haz login para participar.
¿Todavía no conoces debugmodeon?
debugmodeon es la red social para profesionales de la informática
descubre debugmodeon
 

 

© Copyright 2008-2009 debug_mode=ON | Aviso legal | Contacto | FAQ | ¿Quiénes somos? |