不同的浏览器获取事件源的方式是不同的,这源于浏览器在设计之初不同的浏览器对于事件的属性定义不同,下面让我们看一看不同浏览器对于多种同一事件的兼容问题。
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; //判断当前事件源,与其他对象是否满足条件 //绑定事件 }
浏览器中兼容问题有很多,因为浏览器的内核并不一样,厂家也不同,在编写这些浏览器时不同的设计师思维是不同的,编写的语言也不同。对于程序员来说,以较少的代码解决较多的问题,是我们程序员必需的基本素质