当前位置:编程学习 > JAVA >>

Javascript处理DOM元素事件

DOM元素都有一些标准事件,一般使用时只要使用onclick=function的方式就可以了,但是当需要为DOM元素添加多个事件,删除事件,或在用Javascript封装控件的时候,为封装的控件添加自定义事件的时候,onclick=function的方式就不够用了,但是浏览器有addEventListener和attachEvent方法可供调用,从而模拟出类似于C#中的事件委托的事件触发机制!
/*
* 功能:事件处理

* #include JCore.js
*/
var JEvents = function(){
    this.events={};
   
    this.addEvent = function(o){//添加事件
            if(typeof o == 'string'){/*strArg1,strArg2……的方式传递参数*/
                for(var i = 0, a = arguments, v; v = a[i]; i++){
                    v = v.toString().toLowerCase();
                    var enFX = v.indexOf("on")==0 ? v.substr(2) : v;
                    if(!this.events[enFX]){
                        this.events[enFX] = true;
                    }
                }
            }else{
                JCore.apply(this.events, o,false);
            }
    };
    this.addListener = function(eventName,fn,scope/*,Args……*/){//为事件添加处理方法
            if(typeof(eventName)!="string"|| eventName.lenght==0)return;
            if(typeof(fn)!="function")return;
            eventName = eventName.toString().toLowerCase();
            var enFX = eventName.indexOf("on")==0 ? eventName.substr(2) : eventName;
            if(!this.events[enFX]){
                throw "Error! Event /"" + eName + "/" doesnt exist."
            }
            var sp = scope||window;
            var callArgs = Array.prototype.slice.call(arguments, 3);//从第4个参数开始
            callArgs = typeof(callArgs)!="undefined"?callArgs:[];
            var delegate = fn.createDelegate(callArgs,sp);//JCore支持
           
            //为fn方法创建标记,在删除事件时使用
            if(!fn.uid) {
                var time = new Date();
                fn.uid= ""+time.getMinutes()+time.getSeconds()+time.getMilliseconds();
            }
            //标记委托,在删除事件绑定时使用
            delegate.uid = getCacheAttName(enFX,fn.uid);
           
            if(typeof(this.events[enFX])!="object")
                this.events[enFX]=[];
            this.events[enFX].push(delegate);//把方法添加到事件列表中
    };
    this.removeListener = function(eventName,fn){//移除事件绑定
            if(eventName && fn){
                eventName = eventName.toString().toLowerCase();
                var enFX = eventName.indexOf("on")==0?eventName.substr(2):eventName;
                var AttName = getCacheAttName(enFX,fn.uid);
                if(typeof(this.events[enFX])=="object"){//存在这个事件
                    var functions = this.events[enFX];
                    for(i=0;i<functions.length;i++){//依次查找每个方法
                        if(functions[i].uid===AttName){//找到,删除
                            this.events[enFX].remove(functions[i]);
                            break;
                        }
                    }
                }
            }
    }
    this.fireEvent = function(eName,eventArg){//触发事件
            eName = eName.toString().toLowerCase();
            var enFX = eName.indexOf("on")==0 ? eName.substr(2) : eName;
            var Arg = new Array();
            if(typeof(eventArg)!="undefined"){
                if(typeof(eventArg)=="array") Arg=eventArg;
                else Arg.push(eventArg);
            }
&nbs

补充:web前端 , JavaScript ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,