①添加事件方法
addHandler:
function
(element,type,handler){
if
(element.addEventListener){
//檢測是否為DOM2級方法
element.addEventListener(type, handler,
false
);
}
else
if
(element.attachEvent){
//檢測是否為IE級方法
element.attachEvent(
"on"
+ type, handler);
}
else
{
//檢測是否為DOM0級方法
element[
"on"
+ type] = handler;
}
}
②移除之前添加的事件方法
removeHandler:
function
(element, type, handler){
if
(element.removeEventListener){
element.removeEventListener(type, handler,
false
);
}
else
if
(element.detachEvent){
element.detachEvent(
"on"
+ type, handler);
}
else
{
element[
"on"
+ type] =
null
;
}
}
③獲取事件及事件對象目標
//獲取事件對象的兼容性寫法
getEvent:
function
(event){
return
event ? event : window.event;
},
//獲取事件對象目標的兼容性寫法
getTarget:
function
(event){
return
event.target || event.srcElement;
}
④阻止瀏覽器默認事件的兼容性寫法
preventDefault:
function
(event){
if
(event.preventDefault){
event.preventDefault();
}
else
{
event.returnValue =
false
;
}
}
⑤阻止事件冒泡的兼容性寫法
stopPropagation:
function
(event){
if
(event.stopPropagation){
event.stopPropagation();
}
else
{
event.cancelBubble =
true
;
}
}
⑥mouseover和mouseout 事件才包含的獲取相關元素的方法
//mouseover和mouseout 事件才包含的獲取相關元素的方法
getRelatedTarget:
function
(event){
if
(event.relatedTarget){
return
event.relatedTarget;
}
else
if
(event.toElement){
return
event.toElement;
}
else
if
(event.fromElement){
return
event.fromElement;
}
else
{
return
null
;
}
}
⑦鼠標滾輪判斷
/*對於mousedown 和mouseup 事件來說,則在其event 對象存在一個button 屬性,
表示按下或釋放的按鈕。DOM的button 屬性可能有如下3 個值:0 表示主鼠標按鈕,1 表示中間的鼠
標按鈕(鼠標滾輪按鈕),2 表示次鼠標按鈕。在常規的設置中,主鼠標按鈕就是鼠標左鍵,而次鼠標
按鈕就是鼠標右鍵。
IE8 及之前版本也提供了button 屬性,但這個屬性的值與DOM 的button 屬性有很大差異。
0:表示沒有按下按鈕。
1:表示按下了主鼠標按鈕。
2:表示按下了次鼠標按鈕。
3:表示同時按下了主、次鼠標按鈕。
4:表示按下了中間的鼠標按鈕。
5:表示同時按下了主鼠標按鈕和中間的鼠標按鈕。
6:表示同時按下了次鼠標按鈕和中間的鼠標按鈕。
7:表示同時按下了三個鼠標按鈕。*/
getButton:
function
(event){
if
(document.implementation.hasFeature(
"MouseEvents"
,
"2.0"
)){
return
event.button;
}
else
{
switch
(event.button){
case
0:
case
1:
case
3:
case
5:
case
7:
return
0;
case
2:
case
6:
return
2;
case
4:
return
1;
}
}
}
⑧能夠取得鼠標滾輪增量值(delta)的方法
getWheelDelta:
function
(event){
if
(event.wheelDelta){
return
(client.engine.opera && client.engine.opera < 9.5 ?
-event.wheelDelta : event.wheelDelta);
}
else
{
return
-event.detail * 40;
//firefox中的值為+3表示向上滾,-3表示向下滾
}
}
⑨跨瀏覽器的方式取得字符編碼
getCharCode:
function
(event){
if
(
typeof
event.charCode ==
"number"
){
return
event.charCode;
}
else
{
return
event.keyCode;
}
}
⑩訪問剪貼板中的數據
getClipboardText:
function
(event){
var
clipboardData = (event.clipboardData || window.clipboardData);
return
clipboardData.getData(
"text"
);
}
11.設置剪貼板中的數據
setClipboardText:
function
(event, value){
if
(event.clipboardData){
return
event.clipboardData.setData(
"text/plain"
, value);
}
else
if
(window.clipboardData){
return
window.clipboardData.setData(
"text"
, value);
}
}