DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> javascript事件:獲取事件對象getEvent函數
javascript事件:獲取事件對象getEvent函數
編輯:JavaScript基礎知識     

在javascript開發中我們會經常獲取頁面中的事件對象,然後來處理這些事件,例如下面的getEvent函數就是獲取javascript下的頁面事件對象。

function getEvent(event){
    return event || window.event;
}

我們使用getEvent的時候可以這樣調用。

  並且把foo函數綁定到一個onclick事件上。

但是常用的是foo函數不會有參數,或者第一個參數沒有傳入,我們可以通過arguments[0]來獲取第一個參數。
在IE中event是一個全局變量,即window.event,而在Firefox等浏覽器,事件會作為第一個參數傳入foo函數,所以getEvent可以改為:

function getEvent(event){
    return arguments[0] || window.event;
}

 

這時在一些版本的浏覽器,例如Firefox 中會出現獲取不到event對象的問題,其實我們可以看成事件的觸發是下面的方式:

function onclick(event) {
    foo();
}

 

這樣,第一個函數是onclick,即event會默認作為第一個參數傳入,而foo函數沒有將event作為參數傳入,這樣嚴重限制了getEvent的靈活性,所以我們需要修改下getEvent函數。

我們知道arguments.callee是函數本身,在匿名函數中可以作為遞歸使用,那麼arguments.callee.caller指的是調用本函數的上一級函數的函數。
例如getEvent的caller為foo,foo的caller為onclick,依次類推……

所以我們的getEvent函數最終可以這樣來寫:

function getEvent(){
    if(window.event){
        return window.event;
    }
    var f = arguments.callee.caller;
    do{
        var e = f.arguments[0];
        if(e && (e.constructor === Event || e.constructor===MouseEvent || e.constructor===KeyboardEvent)){
        return e;
        }
    }while(f=f.caller);
}
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved