javascript - Manejar todos los tipos de eventos en jQuery

En una aplicación que utiliza jQuery, me gustaría registrar en la consola cada vez que se active cualquier tipo de evento, incluidos los eventos personalizados.

¿Hay alguna manera de hacer esto sin modificar el código fuente de jQuery y sin enlazarse a una lista larga de todos los posibles tipos de eventos?

Respuesta #1

var oldTrigger = jQuery.event.trigger;

jQuery.event.trigger = function(event, data, elem) {
    // do stuff
    oldTrigger.apply(this, arguments);
}

Solo necesito verificar minuciosamente que cada disparador realmente pase por este método.

trigger: function( type, data ) {
            return this.each(function() {
                    jQuery.event.trigger( type, data, this );
            });
    },

Como mínimo, $.fn.trigger pasa por jQuery.event.trigger

            // Trigger the event, it is assumed that "handle" is a function
            var handle = jQuery.data( elem, "handle" );
            if ( handle ) {
                    handle.apply( elem, data );
            }

Alternativamente, puedes sobrescribir jQuery.data e interceptar la configuración de los manejadores de eventos.

for ( var i = 0, l = this.length; i < l; i++ ) {
                            jQuery.event.add( this[i], type, handler, data );
                    }

El método bind utiliza jQuery.event.add para agregar controladores. También puedes interceptar eso.

jQuery.each( ("blur focus focusin focusout load resize scroll unload click dblclick " +
        "mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave " +
        "change select submit keydown keypress keyup error").split(" "), function( i, name ) {

        // Handle event binding
        jQuery.fn[ name ] = function( fn ) {
                return fn ? this.bind( name, fn ) : this.trigger( name );
        };

        if ( jQuery.attrFn ) {
                jQuery.attrFn[ name ] = true;
        }
});

Todos los eventos estándar pasan por $.fn.trigger o $.fn.bind

if ( name === "live" ) {
                                // bind live handler
                                context.each(function(){
                                        jQuery.event.add( this, liveConvert( type, selector ),
                                                { data: data, selector: selector, handler: fn, origType: type, origHandler: fn, preType: preType } );
                                });

$.fn.live pasa por jQuery.event.add.

En conclusión, todo pasa a través de jQuery.event.add y eso a su vez hace esto:

 if ( !eventHandle ) {
                    elemData.handle = eventHandle = function() {
                            // Handle the second event of a trigger and when
                            // an event is called after a page has unloaded
                            return typeof jQuery !== "undefined" && !jQuery.event.triggered ?
                                    jQuery.event.handle.apply( eventHandle.elem, arguments ) :
                                    undefined;
                    };
            }

Que está escribiendo el controlador de eventos en jQuery.data( elem ) donde elem es un nodo del DOM.

[[En conclusión]]

Personalmente diría que jQuery.data es complejo y un dolor de cabeza sobrescribirlo de manera segura, así que en su lugar simplemente sobrescribe jQuery.event.add.

[[Ejemplo en vivo]]

http://jsfiddle.net/qLRuT/8/