• 跨浏览器的事件处理程序


    "DOM2"级事件定义了两个方法用于处理指定和删除程序的操作:addEventListener()和removeEventListener().所有的DOM节点都包含这两个方法,并且他们都接受三个参数:要处理的事件名、作为时间处理程序的函数和一个布尔值,最后这个布尔值参数如果是true,则表示在捕获阶段调用事件处理程序;如果是false,表示在冒泡阶段调用事件处理程序。IE实现了与DOM类似的两个方法:attachEvent()和detachEvent(),他们接受相同的两个参数:时间处理程序名称和事件处理程序函数,由于Ie8及更早版本只支持事件冒泡,所以通过attachEvent()添加的事件处理程序都会被添加到冒泡阶段。

    事件对象:DOM中的事件对象event,IE中的事件对象window.event

    事件目标:DOM中的事件对象event.target,IE中的事件对象event.srcElement

    returnValue相当于DOM中的preventDefault()方法,他们的作用就是取消事件给定的默认行为

    cancelBuble相当于DOM中的stopPropagation()方法,都是用来阻止事件冒泡的

    这里的代码是兼容不同浏览器的写法

    var EventUtil={
      addHandler:function(element,type,handler){
        if(element.addEventListener){
          element.addEventListener(type,handler,false);
        }else if(element.attachEvent){
          element.attachEvent("on"+type,handler);
        }else{
          element["on"+type]=handler;
        }
      },
      getEvent:function(event){
        return event?event:window.event;
      },
      getTarget:function(event){
        return event.target||event.srcElement;
      },
      preventDefault:function(event){
        if(event.preventDefault){
          event.preventDefault();
        }else{
          event.returnValue=false;
        }
      },
      removeHandler:function(element,type,handler){
        if(element.removeEventListener){
          element.removeEventListener(type,element,false);
        }else if(element.detachEvent){
          element.detachEvent("on"+type,handler);
        }else{
          element["on"+type]=null;
        }
      },
      stopPropagation:function(event){
        if(event.stopPropagation){
          event.stopPropagation();
        }else{
          event.cancelBubble=true;
        }
      }
    }

    本人正在学习和摸索中,如有错误,欢迎指正!

  • 相关阅读:
    傻逼Eclipse笔记
    Less笔记
    [转]解决WebClient或HttpWebRequest首次连接缓慢问题
    Css3图标库
    Json.Net4.5 序列化问题
    async和await
    CLR、内存分配和垃圾回收
    C#7.0新语法
    C#6.0新语法
    C#泛型详解
  • 原文地址:https://www.cnblogs.com/xuniannian/p/7449335.html
Copyright © 2020-2023  润新知