JavaScript Event學(xué)習(xí)第三章：早期的事件處理程序

被第二代瀏覽器所支持。

這些古老的瀏覽器只支持一種注冊事件處理程序的方法，這個方法是Netscape發(fā)

明的。因為Netscape先發(fā)制人，所以如果微軟也想做支持JavaScript事件的瀏覽

器就得跟著Netscape走，所以這里沒有兼容性的問題。所以這種模式在任何支持

JavaScript的瀏覽器都能運行---除了Mac上的IE3，他根本就不支持事件。

注冊事件處理程序
在內(nèi)聯(lián)式的事件注冊模型中，事件處理程序就像是一個HTML元素的屬性，比如：

1 <A HREF="somewhere.html" onClick="alert('I\'ve been clicked!')">

當(dāng)這個鏈接上發(fā)生單擊事件的時候，事件處理程序就被觸發(fā)然后執(zhí)行你的腳本：

一個警告對話框彈出。你也可以觸發(fā)一個JavaScript函數(shù)：
1 <A HREF="somewhere.html" onClick="doSomething()">

上面兩個例子里面事件的名字的大小寫只是一個習(xí)慣問題，HTML是大小寫不敏感

的，所以你想怎么寫都可以。XHTML要求所有的屬性名稱必須都是小寫，所以如果

你使用的XHTML那么名字就要寫成onclick。

不要用他
雖然這種內(nèi)聯(lián)型的注冊模型很古老也很可靠，但是他有一個不足。他要求你在

XHTML結(jié)構(gòu)層里面寫上本不屬于這里的JavaScript代碼。

所以我強(qiáng)烈建議你不要使用這種方法。在這里我有詳細(xì)的解釋。

理解這些舊的模型對于JavaScript事件處理的全局感有很大幫助，但是你最好還

是使用我后面說明的現(xiàn)代模式。

默認(rèn)動作
當(dāng)年Netscape設(shè)置了默認(rèn)動作也有怎樣防止默認(rèn)動作運行。他的模式拯救了瀏覽

器大戰(zhàn)和標(biāo)準(zhǔn)的制定，而且到如今都很好的運行著。

眾所周知，當(dāng)用戶點擊了一個鏈接瀏覽器就會按照href的屬性加載頁面。這是鏈

接上的默認(rèn)動作。但是當(dāng)你定義了一個onclick事件處理程序了以后會發(fā)生什么呢

？應(yīng)該能被執(zhí)行，但是什么時候呢？

1 <A HREF="somewhere.html" onClick="doSomething()">

如果在這個鏈接上單擊，那么事件處理程序一定會被首先執(zhí)行。畢竟當(dāng)默認(rèn)動作

發(fā)生--新頁面加載--舊的頁面包括事件處理程序本身都會從內(nèi)存中清除。如果

onclick的事件處理程序執(zhí)行了，那么一定是在默認(rèn)動作之前。

這就有了一個非常重要的原理。如果一個事件同時觸發(fā)了默認(rèn)動作和事件處理程

序，那么：
1、事件處理程序會首先執(zhí)行
2、默認(rèn)動作隨后執(zhí)行
所以在上面的例子中，doSomething()會首先執(zhí)行，然后瀏覽器會打開鏈接。

阻止默認(rèn)事件
當(dāng)這些都確定之后，大家大多開始考慮如何阻止默認(rèn)事件。在我們的例子中就可

以阻止瀏覽器打開新的頁面。

所以事件處理程序可以返回一個布爾值（ture或者false），false的含義就是“

不要進(jìn)行默認(rèn)動作”。這樣我們就可以把例子改成：

1 <A HREF="somewhere.html" onClick="doSomething(); return false">

這個鏈接就不會跟著執(zhí)行了。這個函數(shù)執(zhí)行之后程序返回false，告訴瀏覽器不要

執(zhí)行默認(rèn)動作。

有時候有必要讓函數(shù)決定什么時候該執(zhí)行什么時候不該執(zhí)行默認(rèn)動作。所以我們

可以把例子改成：
1 <A HREF="somewhere.html" onClick="return doSomething()"> 

2   

3 function doSomething() 

4 { 

5     return confirm('Do you really want to follow this link?') 

6 }

這就是（非常簡單的）用戶交互。用戶會被問一個問題，如果回答是肯定的那么

函數(shù)返回true，如果取消了那么久返回一個false。這個返回值會被事件處理程序

捕獲，然后轉(zhuǎn)給事件本身。如果是flase那么默認(rèn)動作就不會被執(zhí)行--鏈接不會進(jìn)

入。

然而，不是所有的默認(rèn)動作都能被阻止。比如unload事件就不行。假設(shè)用戶關(guān)閉

瀏覽器窗口--觸發(fā)了unload事件。如果你能阻止關(guān)閉窗口，那么窗口會違背用戶

的意愿而一直打開著么？當(dāng)然不會。

你可以試試微軟的beforeunload屬性來阻止unload。與其制造一個非�；靵y的情

況讓用戶來選擇確認(rèn)這個行為。那不如不用。

返回false來阻止默認(rèn)動作是所有瀏覽器都支持的這是事件處理程序的基本組成。

如今的事件處理程序模型還添加了一些新的方法來阻止默認(rèn)動作：
W3C給事件添加了preventDefalut()方法。如果你引用了這個方法那么默認(rèn)動作就

會被阻止。
微軟給事件添加了returnValue屬性。如果你設(shè)置他的值為false那么默認(rèn)動作也

會被阻止。
但是用不著這些個，簡單的返回false就夠了。

 

window.status
這里對于返回false有一個例外。當(dāng)你設(shè)置鼠標(biāo)經(jīng)過鏈接的時候改變窗口的狀態(tài)欄

以后，你還想阻止默認(rèn)動作--在狀態(tài)欄顯示鏈接地址--的時候，你就應(yīng)該返回

true：

1 <A HREF="somewhere.html"

2     onMouseOver="window.status = 'This link goes somewhere'; return true">

如果你不這樣做，那么代碼就不會工作。沒人知道那是怎么回事，就是一個比較

怪異的事情。

this
在JavaScript里this關(guān)鍵字通常指函數(shù)的所有者。如果this指向事件發(fā)生的HTML

元素，那么一切都是那么的美好，你可以很簡單的做很多事情。

不幸的是，雖然this非常的強(qiáng)大，但是如果你不是明確的知道他怎么運作的話使

用起來還是比較難的。關(guān)于這個我在另一個地方有詳細(xì)的討論，在這我在內(nèi)聯(lián)模

式下做一些概述。

在內(nèi)聯(lián)模式下你可以將this作為一個事件處理程序函數(shù)的一個參數(shù)。所以你可以：
1 <A HREF="somewhere.html" onClick="doSomething(this)"> 

2   

3 function doSomething(obj) 

4 { 

5     // obj now refers to the link 

6 }

你給函數(shù)傳遞了一個引用，存儲在obj里面。現(xiàn)在你不需要在遍歷文檔尋找是哪個

元素被點擊了：他很安全的存儲在變量obj里面�，F(xiàn)在你就可以：
1 <A HREF="somewhere.html" onClick="return doSomething(this)"> 

2 <A HREF="somewhereElse.html" onClick="return doSomething(this)"> 

3   

4 function doSomething(obj) 

5 { 

6     var linkTo = obj.href; 

7     return confirm('Do you really want to follow the link to ' +

linkTo + '?') 

8 }

函數(shù)接受到一個鏈接的引用存儲在obj里面。現(xiàn)在你可以讀取這個鏈接的鏈接地址

然后進(jìn)行確認(rèn)。你可以把這個技巧運用在任何一個鏈接上：他總是會顯示你剛才

點擊的那個鏈接的真實地址。