$("p").on("click",function(){
  alert("The paragraph was clicked.");
});

$("#box1").off("click");

{
  type: type,
  origType: origType,
  data: data,
  handler: handler,
  guid: guid,
  selector: selector,
  needsContext: needsContext,
  namespace: namespace
}

"div#box":{ //元素
  "Jquery623873":{ //元素的緩存
    "events":{ 
      "click":[
       {  //元素click事件的事件數(shù)據(jù)
             type: type,
             origType: origType,
             data: data,
             handler: handler,
             guid: guid,
             selector: selector,
             needsContext: needsContext,
             namespace: namespace
               }
      ],
      "mousemove":[
       {
             type: type,
             origType: origType,
             data: data,
             handler: handler,
             guid: guid,
             selector: selector,
             needsContext: needsContext,
             namespace: namespace
               }
      ]
    }
  }
}

jQuery.fn.extend( {

  on: function( types, selector, data, fn ) {
    return on( this, types, selector, data, fn );
  },
  one: function( types, selector, data, fn ) {
    return on( this, types, selector, data, fn, 1 );
  },
  off: function( types, selector, fn ) {

    //此處省略處理參數(shù)的代碼

    return this.each( function() {
      jQuery.event.remove( this, types, fn, selector );
    } );
  }
} );

function on( elem, types, selector, data, fn, one ) {
  var origFn, type;

  //此處省略處理參數(shù)的代碼

  //是否是通過(guò)one綁定，是的話使用一個(gè)函數(shù)代理當(dāng)前事件回調(diào)函數(shù)，代理函數(shù)只執(zhí)行一次
  //這里使用到了代理模式
  if ( one === 1 ) {   
    origFn = fn;
    fn = function( event ) {

      // Can use an empty set, since event contains the info
      jQuery().off( event );
      return origFn.apply( this, arguments );
    };

    // Use same guid so caller can remove using origFn
    fn.guid = origFn.guid || ( origFn.guid = jQuery.guid++ );
  }

  /************************************************
  *** jquery將所有選擇到的元素到放到一個(gè)數(shù)組里，然后
  *** 對(duì)每個(gè)元素到使用event對(duì)象的add方法綁定事件
  *************************************************/
  return elem.each( function() {
    jQuery.event.add( this, types, fn, data, selector );
  } );
}

jQuery.event = {

  add: function( elem, types, handler, data, selector ) {

    var handleObjIn, eventHandle, tmp,
      events, t, handleObj,
      special, handlers, type, namespaces, origType,
      elemData = dataPriv.get( elem );  //這句將檢查elem是否被緩存，如果沒(méi)有將會(huì)創(chuàng)建一個(gè)緩存添加到elem元素上。形式諸如：elem["jQuery310057655476080253721"] = {}


    // Don't attach events to noData or text/comment nodes (but allow plain objects)
    if ( !elemData ) {
      return;
    }


    //用戶可以傳入一個(gè)自定義數(shù)據(jù)對(duì)象來(lái)代替事件回調(diào)函數(shù)，將事件回調(diào)函數(shù)放在這個(gè)數(shù)據(jù)對(duì)象的handler屬性里
    if ( handler.handler ) {
      handleObjIn = handler;
      handler = handleObjIn.handler;
      selector = handleObjIn.selector;
    }

    //每個(gè)事件回調(diào)函數(shù)都會(huì)生成一個(gè)唯一的id，以后find/remove的時(shí)候會(huì)用到

    if ( !handler.guid ) {
      handler.guid = jQuery.guid++;
    }

    // 如果元素第一次綁定事件，則初始化元素的事件數(shù)據(jù)結(jié)構(gòu)和主回調(diào)函數(shù)（main）
    //說(shuō)明：每個(gè)元素有一個(gè)主回調(diào)函數(shù)，作為綁定多個(gè)事件到該元素時(shí)的回調(diào)的入口
    if ( !( events = elemData.events ) ) {
      events = elemData.events = {};
    }
    //這里就是初始化主回調(diào)函數(shù)的代碼
    if ( !( eventHandle = elemData.handle ) ) {
      eventHandle = elemData.handle = function( e ) {

        // Discard the second event of a jQuery.event.trigger() and
        // when an event is called after a page has unloaded
        return typeof jQuery !== "undefined" && jQuery.event.triggered !== e.type ?
          jQuery.event.dispatch.apply( elem, arguments ) : undefined;
      };
    }

    // 處理事件綁定，考慮到可能會(huì)通過(guò)空格分隔傳入多個(gè)事件，這里要進(jìn)行多事件處理
    types = ( types || "" ).match( rnotwhite ) || [ "" ];
    t = types.length;
    while ( t-- ) {
      tmp = rtypenamespace.exec( types[ t ] ) || []; 
      type = origType = tmp[ 1 ];
      namespaces = ( tmp[ 2 ] || "" ).split( "." ).sort();

      // There *must* be a type, no attaching namespace-only handlers
      if ( !type ) {
        continue;
      }

      // If event changes its type, use the special event handlers for the changed type
      special = jQuery.event.special[ type ] || {};

      // If selector defined, determine special event api type, otherwise given type
      type = ( selector ? special.delegateType : special.bindType ) || type;

      // Update special based on newly reset type
      special = jQuery.event.special[ type ] || {};

      // 事件回調(diào)函數(shù)的數(shù)據(jù)對(duì)象
      handleObj = jQuery.extend( {
        type: type,
        origType: origType,
        data: data,
        handler: handler,
        guid: handler.guid,
        selector: selector,
        needsContext: selector && jQuery.expr.match.needsContext.test( selector ),
        namespace: namespaces.join( "." )
      }, handleObjIn );

      // 加入第一次綁定該類(lèi)事件，會(huì)初始化一個(gè)數(shù)組作為事件回調(diào)函數(shù)隊(duì)列，每個(gè)元素的每一種事件有一個(gè)隊(duì)列
      if ( !( handlers = events[ type ] ) ) {
        handlers = events[ type ] = [];
        handlers.delegateCount = 0;

        // Only use addEventListener if the special events handler returns false
        if ( !special.setup ||
          special.setup.call( elem, data, namespaces, eventHandle ) === false ) {

          if ( elem.addEventListener ) {
            elem.addEventListener( type, eventHandle );
          }
        }
      }

      if ( special.add ) {
        special.add.call( elem, handleObj );

        if ( !handleObj.handler.guid ) {
          handleObj.handler.guid = handler.guid;
        }
      }

      // 加入到事件回調(diào)函數(shù)隊(duì)列
      if ( selector ) {
        handlers.splice( handlers.delegateCount++, 0, handleObj );
      } else {
        handlers.push( handleObj );
      }

      // Keep track of which events have ever been used, for event optimization
      // 用來(lái)追蹤哪些事件從未被使用，用以優(yōu)化
      jQuery.event.global[ type ] = true;
    }

  }
};

handlers = events[ type ] = [];

if ( selector ) {
  handlers.splice( handlers.delegateCount++, 0, handleObj );
} else {
  handlers.push( handleObj );
}

function Data() {
  this.expando = jQuery.expando + Data.uid++;
}

Data.uid = 1;

//刪除部分沒(méi)用到代碼
Data.prototype = {

  cache: function( owner ) {

    // 取出緩存，可見(jiàn)緩存就是目標(biāo)對(duì)象的一個(gè)屬性
    var value = owner[ this.expando ];

    // 如果對(duì)象還沒(méi)有緩存，則創(chuàng)建一個(gè)
    if ( !value ) {
      value = {};

      // We can accept data for non-element nodes in modern browsers,
      // but we should not, see #8335.
      // Always return an empty object.
      if ( acceptData( owner ) ) {

        // If it is a node unlikely to be stringify-ed or looped over
        // use plain assignment
        if ( owner.nodeType ) {
          owner[ this.expando ] = value;

        // Otherwise secure it in a non-enumerable property
        // configurable must be true to allow the property to be
        // deleted when data is removed
        } else {
          Object.defineProperty( owner, this.expando, {
            value: value,
            configurable: true
          } );
        }
      }
    }

    return value;
  },
  get: function( owner, key ) {
    return key === undefined ?
      this.cache( owner ) :

      // Always use camelCase key (gh-2257) 駝峰命名
      owner[ this.expando ] && owner[ this.expando ][ jQuery.camelCase( key ) ];
  },
  remove: function( owner, key ) {
    var i,
      cache = owner[ this.expando ];

    if ( cache === undefined ) {
      return;
    }

    if ( key !== undefined ) {

      // Support array or space separated string of keys
      if ( jQuery.isArray( key ) ) {

        // If key is an array of keys...
        // We always set camelCase keys, so remove that.
        key = key.map( jQuery.camelCase );
      } else {
        key = jQuery.camelCase( key );

        // If a key with the spaces exists, use it.
        // Otherwise, create an array by matching non-whitespace
        key = key in cache ?
          [ key ] :
          ( key.match( rnotwhite ) || [] );
      }

      i = key.length;

      while ( i-- ) {
        delete cache[ key[ i ] ];
      }
    }

    // Remove the expando if there's no more data
    if ( key === undefined || jQuery.isEmptyObject( cache ) ) {

      // Support: Chrome <=35 - 45
      // Webkit & Blink performance suffers when deleting properties
      // from DOM nodes, so set to undefined instead
      // https://bugs.chromium.org/p/chromium/issues/detail?id=378607 (bug restricted)
      if ( owner.nodeType ) {
        owner[ this.expando ] = undefined;
      } else {
        delete owner[ this.expando ];
      }
    }
  },
  hasData: function( owner ) {
    var cache = owner[ this.expando ];
    return cache !== undefined && !jQuery.isEmptyObject( cache );
  }
};