事件兼容问题

　　

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

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;
        //判断当前事件源，与其他对象是否满足条件
        //绑定事件
    }

　　

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

扫描二维码关注公众号，回复： 8306005 查看本文章