事件兼容问题

  

  不同的浏览器获取事件源的方式是不同的,这源于浏览器在设计之初不同的浏览器对于事件的属性定义不同,下面让我们看一看不同浏览器对于多种同一事件的兼容问题。

 

1.事件处理

  不同浏览器的事件源属性是不相同的为了解决这一问题,我们在书写方法时,会兼容性书写获取事件源的方法。

键盘事件

fuction  keyDown(ev){
  var e = ev || window.event;
  var key = e.target || e.srcElement;        
  if(key==keyCode){
    //......
    }  
}

鼠标事件

function mouse(ev){
    var e =ev||window.event;
    //获取事件源的坐标,
    var key = e.target||e.srcElement
    //或是鼠标的键
}

 

2.事件监听

在用事件监听方法給对象绑定事件时,由于不同浏览器的监听方法不同,会做一下处理

funtion addEvent(ele,type,cb){
   return  ele.attachEvent?ele.attachEvent("on"+type,cb):ele.addEventListener(type,cb);
}

 給对象移除事件也存在兼容问题

function removeEvent(ele,type,cb){
    return ele.detachEvent? ele.detachEvent(type,cb):ele.removeEvent("on"+type,cb);
}

3.事件冒泡

在html盒子里,触发里面的事件时会穿透到父级身上,这种现象叫事件冒泡,为了解决这一问题,要阻止事件冒泡

    function stopBubble(e){
        return window.stopPropagation ? e.stopPropagation():e.cancelBubble = true;
    }

 在IE浏览器里事件冒泡并不是方法,而是属性。

4.事件委托

obj.on+事件 = function(eve){
        var e= eve || window.event;
        var tar = e.target || e.srcElement;
        //判断当前事件源,与其他对象是否满足条件
        //绑定事件
    }

  

浏览器中兼容问题有很多,因为浏览器的内核并不一样,厂家也不同,在编写这些浏览器时不同的设计师思维是不同的,编写的语言也不同。对于程序员来说,以较少的代码解决较多的问题,是我们程序员必需的基本素质

posted on 2019-12-25 09:34  这就是神迹  阅读(194)  评论(0编辑  收藏  举报

导航