WEB开发网
开发学院网页设计JavaScript Jquery源码分析---Event分析 阅读

Jquery源码分析---Event分析

 2010-09-14 13:36:25 来源:WEB开发网   
核心提示: 上面的众多方法都是注册事件,其最终都落在jQuery.event.add();来完成注册的功能,Jquery源码分析---Event分析(5),如果我们采用Dom0或DOM1的事件方法,我们会采用elem.onclick=function(){}来为元素的某一种事件来注册处理函数,或rea

上面的众多方法都是注册事件,其最终都落在jQuery.event.add();来完成注册的功能。如果我们采用Dom0或DOM1的事件方法,我们会采用elem.onclick=function(){}来为元素的某一种事件来注册处理函数。这个最大的缺点就是每个一个事件只是一个处理函数。在dom1的方式中有改进,我们可以采用elem.addEventListener(type, handle, false)为元素的事件注册多个处理函数。

这样的处理方式还不是很完美,如果我们只这个事件运行一次就有点麻烦了。我们要在事件的处理函数中最后进行elem.removeEventListener来取消事件的监听。这样做可能会有事务上的问题。如果第一个事件处理函数在没有取消事件监听之前,就再次触发了怎么办?

还有采用浏览器的方式,它不支持自定义事件的注册和处理,还不能为多个事件注册同一个处理函数。

jQuery.event = {// add 事件到一个元素上。
add : function(elem, types, handler, data) {
if (elem.nodeType == 3 || elem.nodeType == 8) return;// 空白节点或注释
  // IE不能传入window,先复制一下。
if (jQuery.browser.msie && elem.setInterval) elem = window;
// 为handler分配一个全局唯一的Id
if (!handler.guid)  handler.guid = this.guid++;
// 把data附到handler.data中
if (data != undefined) {                       ①
var fn = handler;
handler =this.proxy(fn,function(){return fn.apply(this,arguments);});
handler.data = data;
  }
// 初始化元素的events。如果没有取到events中值,就初始化data: {}    ②
var events =jQuery.data(elem,"events")||jQuery.data(elem,"events",{}),
// 如果没有取到handle中值,就初始化data: function() {....}     ③
handle = jQuery.data(elem, "handle")|| jQuery.data(elem, "handle",
function() {//处理一个触发器的第二个事件和当page已经unload之后调用一个事件。
    if (typeof jQuery != "undefined"&& !jQuery.event.triggered)
      return jQuery.event.handle.apply(//callee.elem=handle.elem
         arguments.callee.elem, arguments);
      });
// 增加elem做为handle属性,防止IE由于没有本地Event而内存泄露。
handle.elem = elem;
// 处理采用空格分隔多个事件名,如jQuery(...).bind("mouseover mouseout", fn);
jQuery.each(types.split(/s+/), function(index, type) {    ④
  // 命名空间的事件,一般不会用到。
var parts = type.split(".");type = parts[0];handler.type = parts[1];
  // 捆绑到本元素type事件的所有处理函数
var handlers = events[type];                     ⑤
if (!handlers) {// 没有找到处理函数列表就初始化事件队列
    handlers = events[type] = {};
  // 如果type不是ready,或ready的setup执行返回false         ⑥
if (!jQuery.event.special[type]|| jQuery.event.special[type].setup
    .call(elem, data) === false) {// 调用系统的事件函数来注册事件
if(elem.addEventListener)elem.addEventListener(type,handle,false);
else if (elem.attachEvent)elem.attachEvent("on" + type, handle);
     }
}
// 把处理器的id和handler形式属性对的形式保存在handlers列表中,
// 也存在events[type][handler.guid]中。
handlers[handler.guid] = handler;                  ⑦
// 全局缓存这个事件的使用标识
jQuery.event.global[type] = true;
});
  
  elem = null; // 防止IE内存泄露。
  },
  guid : 1,
  global : {},

上一页  1 2 3 4 5 6 7 8 9 10  下一页

Tags:Jquery 源码 分析

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接