在使用jQuery的应用程序中,每次触发任何类型的事件时,我都想登录到控制台,包括自定义事件。
在没有修改jQuery源代码的情况下是否有这样做,并且没有绑定到每个可能的事件类型的大长列表?
答案 0 :(得分:8)
var oldTrigger = jQuery.event.trigger;
jQuery.event.trigger = function(event, data, elem) {
// do stuff
oldTrigger.apply(this, arguments);
}
只需仔细检查每个触发器是否都通过此方法。
trigger: function( type, data ) {
return this.each(function() {
jQuery.event.trigger( type, data, this );
});
},
至少$.fn.trigger
通过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
并拦截事件处理程序的设置。
for ( var i = 0, l = this.length; i < l; i++ ) {
jQuery.event.add( this[i], type, handler, data );
}
bind
方法使用jQuery.event.add
添加处理程序。你也可以拦截它。
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
或$.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
经过jQuery.event.add
。
总之,一切都经过jQuery.event.add
,而这反过来就是这样:
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节点。
[[总结]]
就我个人而言,我会说jQuery.data
很复杂且安全覆盖很难,所以只需覆盖jQuery.event.add
。
[[直播示例]]