An EventUtility Class for JavaScript

本文介绍了一种跨浏览器的JavaScript事件处理方法,通过一个实用的EventUtil对象封装了不同浏览器下事件处理的差异,使得开发者可以使用统一的方式为元素绑定或解除事件监听。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 
/*Learn English for Technology.
The soucrecode comes from Professional JavaScript for Web Developers writed by Nicholas C.Zakas
The summary writed by me for the new JavaScript learners.Glad to you can read it.Welcome to commnuctate web Dev Technology with me.
My blog is Http://blog.youkuaiyun.com/takeie.
*/
/*The code shows Event in javascript*/  

var EventUtil = new Object;//Initlialize a object by factory model.

//To attach a event by tow method.The addEventListener supporteb by the browers except ie and
//
attachEvent just supported by ie
EventUtil.addEventHandler = function (oTarget, sEventType, fnHandler) {
    
if (oTarget.addEventListener) {
        oTarget.addEventListener(sEventType, fnHandler, 
false);
    } 
else if (oTarget.attachEvent) {
        oTarget.attachEvent(
"on" + sEventType, fnHandler);
    } 
else {
        oTarget[
"on" + sEventType] = fnHandler;//All supported
    }
};
        
//To Remove a Event from a Object.The removeEventListener property soupported by 
//
firefox and the detachEvent just supported by ie
EventUtil.removeEventHandler = function (oTarget, sEventType, fnHandler) {
    
if (oTarget.removeEventListener) {//firefox
        oTarget.removeEventListener(sEventType, fnHandler, false);
    } 
else if (oTarget.detachEvent) {//ie
        oTarget.detachEvent("on" + sEventType, fnHandler);
    } 
else { 
        oTarget[
"on" + sEventType] = null;//Other Supported
    }
};

//to format a event object
EventUtil.formatEvent = function (oEvent) {
    
if (isIE && isWin) {
        oEvent.charCode 
= (oEvent.type == "keypress"? oEvent.keyCode : 0;
        oEvent.eventPhase 
= 2;
        oEvent.isChar 
= (oEvent.charCode > 0);
        oEvent.pageX 
= oEvent.clientX + document.body.scrollLeft;
        oEvent.pageY 
= oEvent.clientY + document.body.scrollTop;
        oEvent.preventDefault 
= function () {
            
this.returnValue = false;
        };

        
if (oEvent.type == "mouseout") {
            oEvent.relatedTarget 
= oEvent.toElement;
        } 
else if (oEvent.type == "mouseover") {
            oEvent.relatedTarget 
= oEvent.fromElement;
        }

        oEvent.stopPropagation 
= function () {
            
this.cancelBubble = true;
        };

        oEvent.target 
= oEvent.srcElement;
        oEvent.time 
= (new Date).getTime();
    }
    
return oEvent;
};

//Return a object who causes the event.
//
window.event just supported  by ie.
//
caller is a property to return the function's name which called himself.
EventUtil.getEvent = function() {
    
if (window.event) {
        
return this.formatEvent(window.event);
    } 
else {
        
return EventUtil.getEvent.caller.arguments[0];
    }
};
//Now you can use this code to create the object event without thinking whick kind brower it is!
//
Enjoy working at flying Studio
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值