JavaScript中的跨瀏覽器事件操作的基本方法整理
綁定事件
EU.addHandler = function(element,type,handler){
//DOM2級事件處理,IE9也支持
if(element.addEventListener){
element.addEventListener(type,handler,false);
}
else if(element.attachEvent){
//type加'on'
//IE9也可以這樣綁定
element.attachEvent('on' + type,handler);
}
//DOM0級事件處理步,事件流也是冒泡
else{
element['on' + type] = handler;
}
};
取消綁定事件
和綁定事件的處理基本一致,有一個注意點:
傳入的handler必須與綁定事件時傳入的相同(指向同一個函數(shù))
EU.removeHandler = function(element,type,handler){
if(element.removeEventListener){
element.removeEventListener(type,handler);
}
else if(element.attachEvent){
element.detachEvent('on' + type,handler);
}
else{
//屬性置空就可以
element['on' + type] = null;
}
};
跨瀏覽器添加事件
function addEvent(obj,type,fn){
if(obj.addEventListener){
obj.addEventListener(type,fn,false);
}else if(obj.attachEvent){//IE
obj.attchEvent('on'+type,fn);
}
}
跨瀏覽器移除事件
function removeEvent(obj,type,fn){
if(obj.removeEventListener){
obj.removeEventListener(type,fn,false);
}else if(obj.detachEvent){//兼容IE
obj.detachEvent('on'+type,fn);
}
}
跨瀏覽器阻止默認行為
function preDef(ev){
var e = ev || window.event;
if(e.preventDefault){
e.preventDefault();
}else{
e.returnValue =false;
}
}
跨瀏覽器獲取目標對象
function getTarget(ev){
if(ev.target){//w3c
return ev.target;
}else if(window.event.srcElement){//IE
return window.event.srcElement;
}
}
跨瀏覽器獲取滾動條位置
//跨瀏覽器獲取滾動條位置,sp == scroll position
function getSP(){
return{
top: document.documentElement.scrollTop || document.body.scrollTop,
left : document.documentElement.scrollLeft || document.body.scrollLeft;
}
}
跨瀏覽器獲取可視窗口大小
function getWindow () {
if(typeof window.innerWidth !='undefined') {
return{
width : window.innerWidth,
height : window.innerHeight
}
} else{
return {
width : document.documentElement.clientWidth,
height : document.documentElement.clientHeight
}
}
},
相關(guān)文章
JavaScript高級程序設(shè)計(第3版)學(xué)習(xí)筆記11 內(nèi)建js對象
內(nèi)建對象是指由ECMAScript實現(xiàn)提供的、不依賴于宿主環(huán)境的對象,這些對象在程序運行之前就已經(jīng)存在了2012-10-10
基于JavaScript實現(xiàn)繼承機制之調(diào)用call()與apply()的方法詳解
本文將介紹兩種很類似于對象冒充的繼承方式,即使用call()和apply()方法2013-05-05
JavaScript charCodeAt方法入門實例(用于取得指定位置字符的Unicode編碼)
這篇文章主要介紹了JavaScript charCodeAt方法入門實例,charCodeAt方法用于取得指定位置字符的Unicode編碼,需要的朋友可以參考下2014-10-10
向JavaScript的數(shù)組中添加元素的方法小結(jié)
這篇文章主要介紹了向JavaScript的數(shù)組中添加元素的方法小結(jié),分別舉了一些JS數(shù)組操作的例子,基本需要的朋友可以參考下2015-10-10
JavaScript簡介_動力節(jié)點Java學(xué)院整理
JavaScript是一種基于對象(Object)和事件驅(qū)動(EventDriven)并具有安全性能的腳本語言,javascript的出現(xiàn)使得網(wǎng)頁和用戶之間實現(xiàn)了一種實時性的,動態(tài)性的,交互性的關(guān)系,使網(wǎng)頁包含更多活躍的元素和更加精彩的內(nèi)容2017-06-06

