javascript 事件处理示例分享
废话少说，直接奉上示例代码：
<scripttype="text/javascript">
functionEventUtil(){
var_self=this;
///添加事件
varaddEvent=(function(){
if(document.addEventListener){
returnfunction(el,type,fn){
el.addEventListener(type,fn,false);
}
}else{
returnfunction(el,type,fn){
el.attachEvent("on"+type,function(){
returnfn.call(el,window.event);
});
}
}
})();
///添加属性改变事件
varaddPropertyChangeEvent=function(obj,fn){
if(window.ActiveXObject){
obj.onpropertychange=fn;
}else{
obj.addEventListener("input",fn,false);
}
}
//移除事件
varremoveEvent=function(obj,type,fn){
if(obj.removeEventListener){
obj.removeEventListener(type,fn,false);
}elseif(obj.detachEvent){
obj.detachEvent("on"+type,obj["on"+type+fn]);
obj["on"+type+fn]=null;
}
}
//加载事件
varloadEvent=function(fn){
varoldonload=window.onload;
if(typeofoldonload!="function"){
window.onload=fn;
}else{
window.onload=function(){
oldonload();
fn();
}
}
}
//阻止事件
varstopEvent=function(e){
e=e||window.event;
if(e.preventDefault){
e.preventDefault();
e.stopPropagation();
}else{
e.returnValue=false;
e.cancelBubble=true;
}
}
//如果仅仅是阻止事件冒泡
varstopPropagation=function(e){
e=e||window.event;
if(!+"\v1"){
e.cancelBubble=true;
}else{
e.stopPropagation();
}
}
//取得事件源对象
vargetEvent1=function(e){
e=e||window.event;
varobj=e.srcElement?e.srcElement:e.target;
returnobj;
}
//取得事件源对象
vargetEvent2=function(e){
if(window.event)returnwindow.event;
varc=getEvent2.caller;
while(c.caller){
c=c.caller;
}
returnc.arguments[0];
}
//或者这个功能更强大
vargetEvent3=function(e){
vare=e||window.event;
if(!e){
varc=this.getEvent3.caller;
while(c){
e=c.arguments[0];
if(e&&(Event==e.constructor||MouseEvent==e.constructor)){
break;
}
c=c.caller;
}
}
vartarget=e.srcElement?e.srcElement:e.target,
currentN=target.nodeName.toLowerCase(),
parentN=target.parentNode.nodeName.toLowerCase(),
grandN=target.parentNode.parentNode.nodeName.toLowerCase();
return[e,target,currentN,parentN,grandN];
}
_self.addEvent=addEvent; _self.addPropertyChangeEvent=addPropertyChangeEvent; _self.removeEvent=removeEvent; _self.loadEvent=loadEvent; _self.stopEvent=stopEvent; _self.stopPropagation=stopPropagation; _self.getEvent1=getEvent1; _self.getEvent2=getEvent2; _self.getEvent3=getEvent3; } vareventUtil=newEventUtil(); eventUtil.loadEvent(function(){ eventUtil.addEvent(document,"click",function(e){ alert(eventUtil.getEvent3(e)); }); eventUtil.addPropertyChangeEvent(document,function(e){ alert(eventUtil.getEvent3(e)); }); }); </script>