jquery绑定原理 简单解析与实现代码分享

2020-05-23 06:12:52易采站长站整理

var events = data(elem, “events”), ret, index;
if(events){
//如果没出入行为类型 则删除这个元素的所有事件
//如果传入的是.xx这种形式的 把所有行为的包含.xx命名的全部干掉
if ( types === undefined || (typeof types === “string” && types.charAt(0) == “.”) ){
for ( var type in events )
this.remove( elem, type + (types || “”) );
}else{
//不知道干嘛的
if ( types.type ) {
handler = types.handler;
types = types.type;
}
//因为删除事件可以一次支持删除多个 如click mouseover 所有要遍历删除
each(types.split(/s+/),function(index, type){
var namespaces = type.split(“.”);
type = namespaces.shift();
var namespace = RegExp(“(^|.)” + namespaces.slice().sort().join(“.*.”) + “(.|$)”);
if ( events[type] ) {
//如果传了第3个参数 函数 则删除这个事件
if ( handler )
delete events[type][handler.guid];
else{
//遍历中个这个的所有行为
for ( var handle in events[type] ){
// Handle the removal of namespaced events
//删除有特殊命名的函数
//如果没有特殊命名 正则 则是/^|..|$/ 可以匹配空 所以也能删除掉没有特殊命名的函数
if ( namespace.test(events[type][handle].type) )
delete events[type][handle];
}
}
}
for ( ret in events[type] ) break;
//如果events[type]变成空的了 也就是{} 删除这个元素的的绑定事件
if ( !ret ) {
if (elem.removeEventListener)
elem.removeEventListener(type, data(elem, “handle”), false);
else if (elem.detachEvent)
elem.detachEvent(“on” + type, data(elem, “handle”));
ret = null;
delete events[type];
}
});
}
for ( ret in events ) break;
//如果发现元素的整个events都是空的了
//清空掉handle 并且清空掉他所有的引用
if ( !ret ) {
var handle = data( elem, “handle” );
if ( handle ) handle.elem = null;
removeData( elem, “events” );
removeData( elem, “handle” );
}
}
},
handle : function(event){
var all, handlers;
//包装event
event = arguments[0] = gevent.fix( event || window.event );
event.currentTarget = this;
//这里的……..
var namespaces = event.type.split(“.”);
event.type = namespaces.shift();
all = !namespaces.length;
var namespace = RegExp(“(^|.)” + namespaces.slice().sort().join(“.*.”) + “(.|$)”);
//取这个元素的该行为 的 事件列表
handlers = (data(this, “events”) || {} )[event.type];
//遍历这个事件列表 执行该执行的东西
for ( var j in handlers ) {
var handler = handlers[j];
if ( all || namespace.test(handler.type) ) {
// Pass in a reference to the handler function itself
// So that we can later remove it