HTML DOM Event 物件

風靈使發表於2018-11-25
HTML物件

Event 物件

Event 物件代表事件的狀態，比如事件在其中發生的元素、鍵盤按鍵的狀態、滑鼠的位置、滑鼠按鈕的狀態。

事件通常與函式結合使用，函式不會在事件發生前被執行！

事件控制程式碼(Event Handlers)

HTML 4.0 的新特性之一是能夠使 HTML 事件觸發瀏覽器中的行為，比如當使用者點選某個 HTML 元素時啟動一段 JavaScript。下面是一個屬性列表，可將之插入 HTML 標籤以定義事件的行為。

屬性 此事件發生在何時…
onabort 影象的載入被中斷。
onblur 元素失去焦點。
onchange 域的內容被改變。
onclick 當使用者點選某個物件時呼叫的事件控制程式碼。
ondblclick 當使用者雙擊某個物件時呼叫的事件控制程式碼。
onerror 在載入文件或影象時發生錯誤。
onfocus 元素獲得焦點。
onkeydown 某個鍵盤按鍵被按下。
onkeypress 某個鍵盤按鍵被按下並鬆開。
onkeyup 某個鍵盤按鍵被鬆開。
onload 一張頁面或一幅影象完成載入。
onmousedown 滑鼠按鈕被按下。
onmousemove 滑鼠被移動。
onmouseout 滑鼠從某元素移開。
onmouseover 滑鼠移到某元素之上。
onmouseup 滑鼠按鍵被鬆開。
onreset 重置按鈕被點選。
onresize 視窗或框架被重新調整大小。
onselect 文字被選中。
onsubmit 確認按鈕被點選。
onunload 使用者退出頁面。

滑鼠 / 鍵盤屬性

屬性 描述
altKey 返回當事件被觸發時，“ALT” 是否被按下。
button 返回當事件被觸發時，哪個滑鼠按鈕被點選。
clientX 返回當事件被觸發時，滑鼠指標的水平座標。
clientY 返回當事件被觸發時，滑鼠指標的垂直座標。
ctrlKey 返回當事件被觸發時，“CTRL” 鍵是否被按下。
metaKey 返回當事件被觸發時，“meta” 鍵是否被按下。
relatedTarget 返回與事件的目標節點相關的節點。
screenX 返回當某個事件被觸發時，滑鼠指標的水平座標。
screenY 返回當某個事件被觸發時，滑鼠指標的垂直座標。
shiftKey 返回當事件被觸發時，“SHIFT” 鍵是否被按下。

IE 屬性

除了上面的滑鼠/事件屬性，IE 瀏覽器還支援下面的屬性：

屬性 描述
cancelBubble 如果事件控制程式碼想阻止事件傳播到包容物件，必須把該屬性設為 true。
fromElement 對於 mouseover 和 mouseout 事件，fromElement 引用移出滑鼠的元素。
keyCode 對於 keypress 事件，該屬性宣告瞭被敲擊的鍵生成的 Unicode 字元碼。對於 keydown 和 keyup 事件，它指定了被敲擊的鍵的虛擬鍵盤碼。虛擬鍵盤碼可能和使用的鍵盤的佈局相關。
offsetX,offsetY 發生事件的地點在事件源元素的座標系統中的 x 座標和 y 座標。
returnValue 如果設定了該屬性，它的值比事件控制程式碼的返回值優先順序高。把這個屬性設定為 fasle，可以取消發生事件的源元素的預設動作。
srcElement 對於生成事件的 Window 物件、Document 物件或 Element 物件的引用。
toElement 對於 mouseover 和 mouseout 事件，該屬性引用移入滑鼠的元素。
x,y 事件發生的位置的 x 座標和 y 座標，它們相對於用CSS動態定位的最內層包容元素。

標準 Event 屬性

下面列出了 2 級 DOM 事件標準定義的屬性。

屬性 描述
bubbles 返回布林值，指示事件是否是起泡事件型別。
cancelable 返回布林值，指示事件是否可擁可取消的預設動作。
currentTarget 返回其事件監聽器觸發該事件的元素。
eventPhase 返回事件傳播的當前階段。
target 返回觸發此事件的元素（事件的目標節點）。
timeStamp 返回事件生成的日期和時間。
type 返回當前 Event 物件表示的事件的名稱。

標準 Event 方法

下面列出了 2 級 DOM 事件標準定義的方法。IE 的事件模型不支援這些方法：

方法 描述
initEvent() 初始化新建立的 Event 物件的屬性。
preventDefault() 通知瀏覽器不要執行與事件關聯的預設動作。
stopPropagation() 不再派發事件。

相關文章