js监听事件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>监听测试</title> </head> <body> <script type="text/javascript"> /* * 添加事件监听函数 * obj 要添加监听的对象或元素 * eventName 事件名 * fun 监听函数的名称 * param 给监听函数传的参数，这里就传了一个参数 */ function addEventHandler(obj,eventName,fun){ var fn = fun; if(obj.attachEvent){ obj.attachEvent('on'+eventName,fn); }else if(obj.addEventListener){ obj.addEventListener(eventName,fn,false); }else{ obj["on" + eventName] = fn; } } /* * 删除事件监听函数 * obj 要添加监听的对象或元素 * eventName 事件名 * fun 监听函数的名称 */ function removeEventHandler(obj, eventName, fun) { if (obj.removeEventListener) obj.removeEventListener(eventName, fun, false); else if (obj.detachEvent) obj.detachEvent("on" + eventName, fun); else delete obj["on" + eventName]; } var te1=function (){ alert('hello world') } function delte1(){ var obj=document.getElementById("test"); removeEventHandler(obj,'click',te1); } window.onload=function(){ var te=document.getElementById("test"); addEventHandler(te,'click',te1); } </script> <a href="javascript:;" id="test" > 测试监听</a> <a href="javascript:;" onclick="delte1();"> 删除监听</a> </body> </html>
或者：
// event(事件)工具集，来源：github.com/markyun
markyun.Event = {
// 页面加载完成后
readyEvent : function(fn) {
if (fn==null) {
fn=document;
}
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = fn;
} else {
window.onload = function() {
oldonload();
fn();
};
}
},
// 视能力分别使用dom0||dom2||IE方式 来绑定事件
// 参数： 操作的元素,事件名称 ,事件处理程序
addEvent : function(element, type, handler) {
if (element.addEventListener) {
//事件类型、需要执行的函数、是否捕捉
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
element.attachEvent('on' + type, function() {
handler.call(element);
});
} else {
element['on' + type] = handler;
}
},
// 移除事件
removeEvent : function(element, type, handler) {
if (element.removeEnentListener) {
element.removeEnentListener(type, handler, false);
} else if (element.datachEvent) {
element.detachEvent('on' + type, handler);
} else {
element['on' + type] = null;
}
},
// 阻止事件 (主要是事件冒泡，因为IE不支持事件捕获)
stopPropagation : function(ev) {
if (ev.stopPropagation) {
ev.stopPropagation();
} else {
ev.cancelBubble = true;
}
},
// 取消事件的默认行为
preventDefault : function(event) {
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
},
// 获取事件目标
getTarget : function(event) {
return event.target || event.srcElement;
},
// 获取event对象的引用，取到事件的所有信息，确保随时能使用event；
getEvent : function(e) {
var ev = e || window.event;
if (!ev) {
var c = this.getEvent.caller;
while (c) {
ev = c.arguments[0];
if (ev && Event == ev.constructor) {
break;
}
c = c.caller;
}
}
return ev;
}
};
