js事件2-事件兼容问题

对于不同的浏览器，事件响应会有一定的不同，所以我们为了更好的用户效果，必须要考虑好事件兼容性问题。

为了兼容不同的浏览器，我们可以自己编写一个事件对象，通过它的事件添加函数和删除函数来给元素添加/删除对象。

我们在Js中添加一个对象

var  EventFunc={

//定义一个事件添加函数

  addEvent:function(Object,eventname,funct){

     //此处开始编写兼容各种浏览器的添加事件

     if(Object.addEventListener){

              Object.addEventListener(eventname,funct,false);//DOM2级

       }else if(Object.attachEvent){

             Object.attachEvent("on"+eventname,funct);//DOM2级.且注意此时事件名前面要加一个"on"

       } else {

              Object["on"+eventname]=funct//注意IE中的一些低版本上面的两种方式都不支持，所以采用DOM0级，且注意此处一个地方，这儿地方的事件名前面也要加上"on"

        那有的人会说Object."on"+eventname=funct不行吗？  这样是不行的，"."后面是不能加字符串的，所以我们可以通过[]来实现，不用"."  这个地方千万要注意。

         } 

//定义删除事件函数

removeEvent：function(){

 if(Object.addEventListener){

              Object.removeEventListener(eventname,funct,false);//DOM2级

       }else if(Object.attachEvent){

             Object.detachEvent("on"+eventname,funct);//DOM2级.且注意此时事件名前面要加一个"on"

       } else {

              Object["on"+eventname]=null//注意IE中的一些低版本上面的两种方式都不支持，所以采用DOM0级，且注意此处一个地方，这儿地方的事件名前面也要加上"on"

        那有的人会说Object."on"+eventname=funct不行吗？  这样是不行的，"."后面是不能加字符串的，所以我们可以通过[]来实现，不用"."  这个地方千万要注意。

         } 
}

     }

如果我们想要给某个元素添加点击事件的话，直接皆可以了

EventFunc.addEvent(Object,"click",function(){ ....})其中我们是"click",不是"onclick",还有后面可以直接写函数名：例如如果有一个函数 function showMes(){...}

那我们可以直接写showMes,注意奥，这里不是showMes()奥，也不是"showMes",

巴特西

js事件2-事件兼容问题

最新文章

热门文章