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


    "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;
        }
      }
    }

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

  • 相关阅读:
    第五周课后作业
    第五周读书笔记
    PB16120853+JL17110067
    第一次个人作业报告
    《编程匠艺》读书笔记----第四周
    软工第一次个人作业博客(一)
    软工第一次个人作业博客(二)
    《程序员修炼之道》读书笔记(二)--第三周
    关于在aspx前台使用后台变量的问题
    sql语句优化SQL Server
  • 原文地址:https://www.cnblogs.com/xuniannian/p/7449335.html
Copyright © 2020-2023  润新知