跨浏览器事件处理程序

 window.onload = function(){
            var Event = {
                addHandler : function(element,type,handler){
                    if(element.addEventListener){
                        element.addEventListener(type,handler,false);//DOM2级方法 三个参数 事件名称 事件处理程序函数 最后一个布尔值参数如果为true表示在捕获阶段调用事件处理处理程序 如果是false表示在冒泡阶段调用事件处理程序 默认为false
                    }else if(element.attachEvent(type,handler)){//attachEvent是IE中的方法
                        element.attachEvent('on'+type,handler);//接受两个参数 并且事件名称需要加'on' onclick
                    }else{
                        element['on'+type] = handler;//DOM0级
                    }
                },
                removeHandler : function(element,type,handler){
                    if(element.removeEventListener(type,handler,false)){//移除的时候 所有参数必须 与创建的一致 否则无法删除 如果handler是个匿名函数 无法删除。
                        element.removeEventListener(type,handler,false);
                    }else if(element.detachEvent('on'+type,handler)){
                        element.detachEvent('on'+type,handler)
                    }else{
                        element['on'+type] = null;
                    }
                }
            }
            function al(){
                alert('按钮被单击了');
            }
            var oBtn = document.getElementById('btn');
            Event.addHandler(oBtn,'click',al);
        }
<input type="button" value="按钮" id="btn"/>

 

posted @ 2016-05-04 20:11  dzxczx  阅读(105)  评论(0编辑  收藏  举报