您的位置:首页 > Web前端 > JQuery

jQuery源码分析之blur focus focusin focusout load resize scroll unload click dblclick等方法

2015-10-17 14:30 681 查看
blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error contextmenu源码如下:

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 contextmenu").split(" "), function( i, name ) {
// Handle event binding
jQuery.fn[ name ] = function( data, fn ) {
return arguments.length > 0 ?
this.on( name, null, data, fn ) ://如果调用时候传入的只有一个函数,那么data就是这个函数,在on方法里对他进行调整!
this.trigger( name );
};
});


注意:从上面的代码可以知道,给on函数传递的第二个参数是null,也就是这些方法的API不能传递selector进行代理!

hover方法源码:

hover: function( fnOver, fnOut ) {
return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
}


总结:这些函数接受两个参数,一个是额外数据一个是回调函数。如果不传入参数,那么就是触发调用对象的所有的同类型方法,否则就是为调用对象添加事件!注意on方法底层调用的是jQuery.event.add方法!如果是添加函数那么调用时候可以获取到添加事件的所有属性!参见点击打开链接

(1)回调函数中this指向当前元素!,也就是currentTarget。apply( matched.elem, args )是在dispatch里面的源码,但是因为这里用的是apply而不是call,所以直接把args逐个封装到回调函数中。这个args只有一个参数args[0]=event所以这里回调函数中唯一一个参数就是event,同时可以通过event.data获取数据,通过delegateTarget获取代理对象BODY。通过handleObj可以获取通过add方法添加的事件的所有信息,也就是通过add方法里面添加的handleObj所有属性!同时可以通过currentTarget获取当前所在的元素!总之一句话:在该回调函数中可以获取这个调用事件的所有的信息!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: