JavaScript addEvent函数
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript addEvent函数相关的知识，希望对你有一定的参考价值。
function addEvent(element,type,handler)
if(!handler.$$guid) handler.$$guid = addEvent.guid++;
if(!element.events) element.events = ;
var handlers = element.events[type];
if(!handlers)
handlers = element.events[type] = ;
/*
if(element["on" + type])
handlers[0] = element["on" + type];
*/
//按照序号存进去
handlers[handler.$$guid] = handler;
//赋予一个全局事件处理函数来处理所有工作
element["on" + type] = handleEvent;
addEvent.guid = 1;
function removeEvent(element,type,handler)
if(element.events && element.events[type])
delete element.events[type][handler.$$guid];
function handleEvent(event)
var returnValue = true;
event = event || fixEvent(window.event);
var handlers = this.events[event.type];
for(var i in handlers)
this.$$handleEvent = handlers[i];
if(this.$$handleEvent(event) === false)
returnValue = false;
return returnValue;
function fixEvent(event)
event.preventDefault = fixEvent.preventDefault;
event.stopPropagation = fixEvent.stopPropagation;
return event;
fixEvent.preventDefault = function()
this.returnValue = false;
fixEvent.stopPropagation = function()
this.cancelBubble = true;
这是一段Dean Edward 所写的通用的事件绑定函数。我想问一下addEvent函数中element["on" + type] = handleEvent;这句话是什么意思，element["on" + type]是什么东西啊？element是元素，然后中括号ontype ，难道是散列表不成？
中element["on" + type], element是传进来的标签对象 type就是传入的事件名如 click等
举个例子 type 为click，那合起来意思等同 element.onclik=handleEvent,其中handleEvent就是
事件触发调用的函数。
理解这种写法就要理解 对象的j定义
如 var obj=｛a：123｝如果要取obj对象的123这个值，那有2种方法取
1 --用点号 obj.a
2 -- 用【】 obj【“a”】上面程序就是用的这种形式. 参考技术A if(typeof window.addEventListener==="function")
alert("DOM浏览器");
else
alert("IE");
高手写的一个检测浏览器的代码
var isIE = !!(window.attachEvent && !window.opera);
var isOpera = !!window.opera;
var isSafari = navigator.userAgent.indexOf(’AppleWebKit/’) > -1;
var isMoz = navigator.userAgent.indexOf(’Gecko’) > -1 && navigator.userAgent.indexOf(’Khtml’) == -1;
var isMobileSafari = !!navigator.userAgent.match(/Apple.*Mobile.*Safari/);
var isIE5 = (navigator.appVersion.indexOf("MSIE 5")>0) || (navigator.appVersion.indexOf("MSIE")>0 && parseInt(navigator.appVersion)> 4);
var isIE55 = (navigator.appVersion.indexOf("MSIE 5.5")>0);
var isIE6 = (navigator.appVersion.indexOf("MSIE 6")>0);
var isIE7 = (navigator.appVersion.indexOf("MSIE 7")>0);
var isIE8 = (navigator.appVersion.indexOf("MSIE 8")>0);
attachEvent方法，为某一事件附加其它的处理事件。（不支持Mozilla系列）
addEventListener方法 用于 Mozilla系列
document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3;
Java代码
if (window.addEventListener)
window.addEventListener('load', _uCO, false);
else if (window.attachEvent)
window.attachEvent('onload', _uCO);
var handler = function()
var host = document.location.href;
if(host.indexOf('jx163.cn') >= 0)
document.location = "/";
else ;
;
// 添加监听
if (window.addEventListener)
window.addEventListener('DOMContentLoaded', handler, false);
window.addEventListener('load', handler, false);
else if (window.attachEvent)
window.attachEvent('onload', handler);
else
window.onload = handler;
init();
</script>
</head>
<body>
－－－－－－－－－－－－－－－－－－－－
window和firefox下的event
－－－－－－－－－－－－－－－－－－－－
<SCRIPT LANGUAGE="javascript">
<!--
function hh(e)
alert(arguments[0]);
e=window.event||e;
var el=e.srcElement||e.target;
alert(el.value);
//-->
</SCRIPT>
<INPUT id ="button2" value ="hahahahah" TYPE="button" onclick="hh(event);">
－－－－－－－－－－－－－－－－－－－－
test
－－－－－－－－－－－－－－－－－－－－
if(WebComm.getOS() == "MSIE")
obj.setCapture ();
else
document.addEventListener("mousemove",WebComm.MoveDiv,false);
if(WebComm.getOS() == "MSIE")
obj.releaseCapture ();
else
document.removeEventListener("mousemove",WebComm.MoveDiv,false);
参考技术B a) function addEvent(el, type, fn)
if(el.attachEvent)
el['e’+type+fn] = fn;
el[type+fn] = function()
el[‘e’+type+fn](window.event);
el.attachEvent(‘on’+type, el[type+fn]);
else
el.addEventListener(type, fn, false);
addEvent(window, 'load', init);
function init()
var odiv = document.getElementByIdx_x("divtest");
addEvent(odiv, 'onmouseover', onmousefunc);
addEvent(odiv, 'onclick', onclickfunc);
addEvent(odiv, 'onmouseout', mouseoutfunc);
function onmousefunc() ...
function onclickfunc() ...
JavaScript设计模式与开发实践：惰性函数
Web开发中，因为浏览器之间的差异实现差异，一些嗅探工作总是不可避免的，比如我们需要在各个浏览器中能够通用事件绑定函数addEvent
//一般写法 //缺点：当他每次被调用的时候都都会执行里面的if条件， var addEvent = function(elem, type, handler){ if(window.addEventLister){ return elem.addEventListener(type, handler, false); } if(window.attachEvent){ return elem.attachEvent(‘on‘+type, handler); } } //改进 var addEvent = (function(){ if(window.addEventListener){ return function(elem, type, handler){ elem.addEventListener(type, handler, false); } } if(window.attachEvent){ return function(elem, type, handler){ elem.atttachEvent(‘on‘+handler); } } })(); //惰性载入方案 var addEvent = function(elem, type, handler){ if(window.addEventListener){ addEvent = function(elem, type, handler){ elem.addEventListener(type, handler, false); } } else if(window.atttachEvent){ addEvent = function(elem, type, handler){ elem.atttachEvent(‘on‘+type, handler); } } addEvent(elem, type, handler); };
以上是关于JavaScript addEvent函数的主要内容，如果未能解决你的问题，请参考以下文章