IE和Firefox下event事件雜談
2024-05-06 14:12:16
供稿：網友
因為javascript的事件模型有三種，它們分別是NN4、IE4+和W3C/Safari;這也造成了在不同的瀏覽器中處理event的差異，這里結合一些零碎的代碼來說明如何做到event在IE4+和Firefox下的正常工作。
首先看如下代碼：
代碼如下:
function doEventThing(eventTag){
var event = eventTag||window.event;
var currentKey = event.charCode||event.keyCode;
var eventSource =window.event.srcElement||eventTag.target;
}
這段代碼主要是為了處理鍵盤事件的，在IE中event作為window對象的一個屬性可以直接使用，但是在Firefox中卻使用了W3C的模型，它是通過傳參的方法來傳播事件的，也就是說你需要為你的函數提供一個事件響應的接口，在上述函數中，
eventTag扮演的就是這個角色。
var event = eventTag||window.event;
這段代碼可以根據瀏覽器的不同來得到正確的event，并在程序中使用，如果在IE4+下面使用這段代碼，因為eventTag為null可以保證event = window.event，但是如果在Firefox下運行的話則因為手工的給定了eventTag所以var event = eventTag。根據對這一段代碼的分析我們也不難看出可以對doEventThing方法進行如下的改造(因為javascript允許我們在定義function的時候不明確指出參數的數量):
代碼如下:
function doEventThing(){
var event = arguments[0]||window.event;
//other code
}
在Firefox下arguments[0]在特定的場合(沒有顯式的指定function參數數量的時候)被做為傳播事件的參數來使用…………
至于var currentKey = event.charCode||event.keyCode;也是不同的瀏覽器所致，在IE4+下面記錄鍵盤的是keyCode，但是在Firefox下的卻是charCode,為此我們需要處理他們的差異。
還有一個差異就是事件源的獲取：通過語句
var eventSource = window.event.srcElement||eventTag.target;
我們也看到了IE與W3C的不同。
經過上面的包裝，我們基本上可以在IE4+和Firefox下面順利的使用事件機制了，當然如果為了通用性可以對這種差異進封裝來形成自己的Event對象在程序中誤差別的使用事件對象，這里就不在介紹了。
接下來分析事件的綁定：大概分為如下5種
1、綁定到元素，這也是比較常見的一種比如：
<input type="button" onclick="doEventThing(event)">
,這樣我們就把doEventThing綁定到了該button對象上，點擊此按鈕事件就被觸發。
2、綁定事件到對象：這也是比較常見的一種，特別是在IE4+下面：
document.getElementById("divid").onclick = doEventThing;
3、使用<script for>進行事件的綁定，這只在IE4+下有用（為buttong1綁定事件，邏輯在script塊中書寫event來指定怎么觸發事件）：
<script event="onclick" for="button1">
// script statements here
