Dom多事件登记
Dom多事件注册
今天看到这样一段代码,如下:
仔细一看,其实是实现了dom的多事件注册,稍稍重构了一下,将事件注册的任务封装进EventManager中,这样看着舒服多了,而且以后可以重用:
今天看到这样一段代码,如下:
Page.clickFunctions = []; Page.click = function(event){ for(var i=0;i<Page.clickFunctions.length;i++){ Page.clickFunctions[i](event); } if(window!=window.parent&&window.parent.Page){ window.parent.Page.click(); } } Page.onClick = function(f){ Page.clickFunctions.push(f); } Page._Sort = function(a1,a2){ var i1 = a1[1]; var i2 = a2[1]; if(typeof(i1)=="number"){ if(typeof(i2)=="number"){ if(i1>i2){ return 1; }else if(i1==i2){ return 0; }else{ return -1; } } return -1; }else{ if(typeof(i2)=="number"){ return 1; }else{ return 0; } } } Page.loadFunctions = []; Page.load = function(){ Page.loadFunctions.sort(Page._Sort); for(var i=0;i<Page.loadFunctions.length;i++){ try{ Page.loadFunctions[i][0](); }catch(ex){ } } } Page.onLoad = function(f,index){ index = index || 1; Page.loadFunctions.push([f,index]); } Page.readyFunctions = []; Page.ready=function(){ if(window._OnReady){ try{window._OnReady();}catch(ex){} } Page.readyFunctions.sort(Page._Sort); for(var i=0;i<Page.readyFunctions.length;i++){ try{Page.readyFunctions[i][0]();}catch(ex){} } }; Page.onReady= function(f,index){ Page.readyFunctions.push([f,index]); }; Page.mouseDownFunctions = []; Page.mousedown = function(event){ for(var i=0;i<Page.mouseDownFunctions.length;i++){ Page.mouseDownFunctions[i](event); } } Page.onMouseDown = function(f){ Page.mouseDownFunctions.push(f); } Page.mouseUpFunctions = []; Page.mouseup = function(event){ for(var i=0;i<Page.mouseUpFunctions.length;i++){ Page.mouseUpFunctions[i](event); } } Page.onMouseUp = function(f){ Page.mouseUpFunctions.push(f); } Page.mouseMoveFunctions = []; Page.mousemove = function(event){ for(var i=0;i<Page.mouseMoveFunctions.length;i++){ Page.mouseMoveFunctions[i](event); } } Page.onMouseMove = function(f){ Page.mouseMoveFunctions.push(f); } Page.keyDownFunctions = []; Page.keydown = function(event){ for(var i=0;i<Page.keyDownFunctions.length;i++){ Page.keyDownFunctions[i](event); } } Page.onKeyDown = function(f){ Page.keyDownFunctions.push(f); } /* 监听document对象上的click、mousedown、load、mouseup、mousemove事件 */ if (document.attachEvent) { document.attachEvent("onclick", Page.click); document.attachEvent("onmousedown", Page.mousedown); window.attachEvent("onload", Page.load); document.attachEvent("onmouseup", Page.mouseup); document.attachEvent("onmousemove", Page.mousemove); } else { document.addEventListener("click", Page.click, false); document.addEventListener("mousedown", Page.mousedown, false); window.addEventListener("load", Page.load, false); document.addEventListener("mouseup", Page.mouseup, false); document.addEventListener("mousemove", Page.mousemove, false); }
仔细一看,其实是实现了dom的多事件注册,稍稍重构了一下,将事件注册的任务封装进EventManager中,这样看着舒服多了,而且以后可以重用:
/* 监听document/window对象上的click、mousedown、load、mouseup、mousemove事件 */ Page.onClick = function(fun) { Sky.EventManager.addEvent(document, "click", fun); } Page.onLoad = function(fun, index) { Sky.EventManager.addEvent(window, "load", fun, index); } Page.onMouseDown = function(fun) { Sky.EventManager.addEvent(document, "mousedown", fun); } Page.onMouseUp = function(fun) { Sky.EventManager.addEvent(document, "mouseup", fun); } Page.onMouseMove = function(fun) { Sky.EventManager.addEvent(document, "mousemove", fun); } Page.onKeyDown = function(fun) { Sky.EventManager.addEvent(document, "keydown", fun); }