处理jQuery中的所有事件类型 [英] Handle all event types in jQuery

问题描述

在使用jQuery的应用程序中，每次触发任何类型的事件时，我都希望登录到控制台，包括自定义事件。

In an application using jQuery, I'd like to log to the console every time any type of event is triggered, including custom events.

有没有这样做不需要修改jQuery源代码，而不是绑定到每个可能的事件类型的大长列表？

Is there anyway of doing this without modifying the jQuery source, and without binding to a big long list of every possible event type?

推荐答案

var oldTrigger = jQuery.event.trigger;

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

只需要仔细检查每个触发器是否通过此方法。 / p>

Just need to throughly double check that every trigger does go through this method.

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

至少 $。fn.trigger 通过jQuery.event.trigger

At the very least $.fn.trigger goes through 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 );
            }

或者您可以覆盖 jQuery.data 并拦截事件处理程序的设置。

Alternatively you can overwrite jQuery.data and intercept the setting of event handlers.

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

bind 使用 jQuery.event.add 添加处理程序。你也可以拦截。

The bind method uses jQuery.event.add to add handlers. You can also intercept that.

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;
        }
});

所有标准事件都通过 $。fn.trigger

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 code> jQuery.event.add 。

$.fn.live goes through jQuery.event.add.

总之，一切都通过 jQuery.event.add ，然后这样做：

In conclusion everything goes through jQuery.event.add and that in turns does this :

 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;
                    };
            }

哪个是将事件处理程序写入 jQuery.data （elem）其中 elem 是一个DOM节点。

Which is writing the event handler to jQuery.data( elem ) where elem is a DOM Node.

[[结论]]

个人我会说 jQuery.data 是复杂的，并且是一个痛苦的覆盖安全地，而不是覆盖 jQuery.event.add 。

Personally I would say jQuery.data is complex and a pain to overwrite safely so instead just overwrite jQuery.event.add.

[[实例 ]]

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

这篇关于处理jQuery中的所有事件类型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！