jQuery Event add [ 源碼分析 ]

jQuery Event add [ 源碼分析 ]

/* * Helper functions for managing events -- not part of the public interface. * Props to Dean Edwards' addEvent library for many of the ideas. */jQuery.event = {add: function( elem, types, handler, data, selector ) {var elemData, eventHandle, events,t, tns, type, namespaces, handleObj,handleObjIn, quick, handlers, special;// Don't attach events to noData or text/comment nodes (allow plain objects tho)if ( elem.nodeType === 3 || elem.nodeType === 8 || !types || !handler || !(elemData = jQuery._data( elem )) ) {return;}// Caller can pass in an object of custom data in lieu of the handler// 這裡在之前一直不明白為什麼要這麼做，原因就是這裡的handler 可以是一個function,即我們平時所說的綁定的事件方法// 同時也可以是一個事件對象，也就是下面所說的handleObj,那麼如果是在jQuery的內部是可以傳遞一個事件對象過來的if ( handler.handler ) {handleObjIn = handler;handler = handleObjIn.handler;selector = handleObjIn.selector;}// Make sure that the handler has a unique ID, used to find/remove it later// 這裡分配guidif ( !handler.guid ) {handler.guid = jQuery.guid++;}// Init the element's event structure and main handler, if this is the first// 從緩衝系統中，從緩衝事件對象中擷取events數組events = elemData.events;if ( !events ) {elemData.events = events = {};}//主監聽函數，唯一一個綁定到dom元素的方法，會調用dispatch分配事件eventHandle = elemData.handle;if ( !eventHandle ) {elemData.handle = eventHandle = function( e ) {// Discard the second event of a jQuery.event.trigger() and// when an event is called after a page has unloaded//這裡主要防止trigger 手動觸發時的二次冒泡。這裡在trigger中，會存在類比冒泡的事件，//主要針對不能冒泡的事件如：focus 就只能類比冒泡事件//如果已經冒泡過了，那麼在這裡就不需要再次執行了。return typeof jQuery !== "undefined" && (!e || jQuery.event.triggered !== e.type) ?jQuery.event.dispatch.apply( eventHandle.elem, arguments ) :undefined;};// Add elem as a property of the handle fn to prevent a memory leak with IE non-native events// 這裡主要針對ie的記憶體問題eventHandle.elem = elem;}// Handle multiple events separated by a space// jQuery(...).bind("mouseover mouseout", fn);// 切割多個事件組合types = jQuery.trim( hoverHack(types) ).split( " " );for ( t = 0; t < types.length; t++ ) {//使用正則切割命名空間//rtypenamespace = /^([^\.]*)?(?:\.(.+))?$/,//如: click.namespace ,hover.namespace//==> ["click.namespace", "click", "namespace", index: 0, input: "click.namespace"] tns = rtypenamespace.exec( types[t] ) || [];type = tns[1];namespaces = ( tns[2] || "" ).split( "." ).sort();// If event changes its type, use the special event handlers for the changed type// 這裡主要對事件進行修複，看是否在special中存有定義，如果有，剛使用special中的事件類型替換之// 主要是某些原生事件，對瀏覽器存在相容問題，所以需要替換special = jQuery.event.special[ type ] || {};// If selector defined, determine special event api type, otherwise given type// 這裡的selector為代理事件，如果存在selector，那麼就存在冒泡事件// 對於delegateType主要是對原生不能冒泡的事件進行替換如：focus => focusin// 那麼如果原生事件對於冒泡沒有問題，那麼檢測綁定類型是否需要修複：如： mouseover ==> mouseenter type = ( selector ? special.delegateType : special.bindType ) || type;// Update special based on newly reset typespecial = jQuery.event.special[ type ] || {};// handleObj is passed to all event handlershandleObj = jQuery.extend({type: type,origType: tns[1],data: data,handler: handler,guid: handler.guid,selector: selector,quick: selector && quickParse( selector ),namespace: namespaces.join(".")}, handleObjIn );// Init the event handler queue if we're the firsthandlers = events[ type ];if ( !handlers ) {handlers = events[ type ] = [];handlers.delegateCount = 0;// Only use addEventListener/attachEvent if the special events handler returns falseif ( !special.setup || special.setup.call( elem, data, namespaces, eventHandle ) === false ) {// Bind the global event handler to the elementif ( elem.addEventListener ) {elem.addEventListener( type, eventHandle, false );} else if ( elem.attachEvent ) {elem.attachEvent( "on" + type, eventHandle );}}}if ( special.add ) {special.add.call( elem, handleObj );if ( !handleObj.handler.guid ) {handleObj.handler.guid = handler.guid;}}// Add to the element's handler list, delegates in frontif ( selector ) {handlers.splice( handlers.delegateCount++, 0, handleObj );} else {handlers.push( handleObj );}// Keep track of which events have ever been used, for event optimizationjQuery.event.global[ type ] = true;}// Nullify elem to prevent memory leaks in IEelem = null;}