Html頁面Dom對象之EventHTML DOM Event 對象

<a href="http://www.w3school.com.cn/tiy/t.asp?f=hdom_event_button" target="_blank">哪個滑鼠按鈕被點選？</a>

<a href="http://www.w3school.com.cn/tiy/t.asp?f=hdom_event_clientx" target="_blank">光标的坐标是？</a>

<a href="http://www.w3school.com.cn/tiy/t.asp?f=hdom_event_keycode" target="_blank">被按的按鍵的 unicode 是？</a>

<a href="http://www.w3school.com.cn/tiy/t.asp?f=hdom_event_screenxy" target="_blank">相對于螢幕，光标的坐标是？</a>

<a href="http://www.w3school.com.cn/tiy/t.asp?f=hdom_event_shiftkey" target="_blank">shift 鍵被按了嗎？</a>

<a href="http://www.w3school.com.cn/tiy/t.asp?f=hdom_event_srcelement" target="_blank">哪個元素被點選了？</a>

<a href="http://www.w3school.com.cn/tiy/t.asp?f=hdom_event_type" target="_blank">哪個事件類型發生了？</a>

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

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

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

屬性

此事件發生在何時...

<a href="http://www.w3school.com.cn/jsref/event_onabort.asp" target="_top">onabort</a>

圖像的加載被中斷。

<a href="http://www.w3school.com.cn/jsref/event_onblur.asp" target="_top">onblur</a>

元素失去焦點。

<a href="http://www.w3school.com.cn/jsref/event_onchange.asp" target="_top">onchange</a>

域的内容被改變。

<a href="http://www.w3school.com.cn/jsref/event_onclick.asp" target="_top">onclick</a>

當使用者點選某個對象時調用的事件句柄。

<a href="http://www.w3school.com.cn/jsref/event_ondblclick.asp" target="_top">ondblclick</a>

當使用者輕按兩下某個對象時調用的事件句柄。

<a href="http://www.w3school.com.cn/jsref/event_onerror.asp" target="_top">onerror</a>

在加載文檔或圖像時發生錯誤。

<a href="http://www.w3school.com.cn/jsref/event_onfocus.asp" target="_top">onfocus</a>

元素獲得焦點。

<a href="http://www.w3school.com.cn/jsref/event_onkeydown.asp" target="_top">onkeydown</a>

某個鍵盤按鍵被按下。

<a href="http://www.w3school.com.cn/jsref/event_onkeypress.asp" target="_top">onkeypress</a>

某個鍵盤按鍵被按下并松開。

<a href="http://www.w3school.com.cn/jsref/event_onkeyup.asp" target="_top">onkeyup</a>

某個鍵盤按鍵被松開。

<a href="http://www.w3school.com.cn/jsref/event_onload.asp" target="_top">onload</a>

一張頁面或一幅圖像完成加載。

<a href="http://www.w3school.com.cn/jsref/event_onmousedown.asp" target="_top">onmousedown</a>

滑鼠按鈕被按下。

<a href="http://www.w3school.com.cn/jsref/event_onmousemove.asp">onmousemove</a>

滑鼠被移動。

<a href="http://www.w3school.com.cn/jsref/event_onmouseout.asp" target="_top">onmouseout</a>

滑鼠從某元素移開。

<a href="http://www.w3school.com.cn/jsref/event_onmouseover.asp" target="_top">onmouseover</a>

滑鼠移到某元素之上。

<a href="http://www.w3school.com.cn/jsref/event_onmouseup.asp" target="_top">onmouseup</a>

滑鼠按鍵被松開。

<a href="http://www.w3school.com.cn/jsref/event_onreset.asp" target="_top">onreset</a>

重置按鈕被點選。

<a href="http://www.w3school.com.cn/jsref/event_onresize.asp" target="_top">onresize</a>

視窗或架構被重新調整大小。

<a href="http://www.w3school.com.cn/jsref/event_onselect.asp" target="_top">onselect</a>

文本被選中。

<a href="http://www.w3school.com.cn/jsref/event_onsubmit.asp" target="_top">onsubmit</a>

确認按鈕被點選。

<a href="http://www.w3school.com.cn/jsref/event_onunload.asp" target="_top">onunload</a>

使用者退出頁面。

描述

<a href="http://www.w3school.com.cn/jsref/event_altkey.asp">altKey</a>

傳回當事件被觸發時，"ALT" 是否被按下。

<a href="http://www.w3school.com.cn/jsref/event_button.asp">button</a>

傳回當事件被觸發時，哪個滑鼠按鈕被點選。

<a href="http://www.w3school.com.cn/jsref/event_clientx.asp">clientX</a>

傳回當事件被觸發時，滑鼠指針的水準坐标。

<a href="http://www.w3school.com.cn/jsref/event_clienty.asp">clientY</a>

傳回當事件被觸發時，滑鼠指針的垂直坐标。

<a href="http://www.w3school.com.cn/jsref/event_ctrlkey.asp">ctrlKey</a>

傳回當事件被觸發時，"CTRL" 鍵是否被按下。

<a href="http://www.w3school.com.cn/jsref/event_metakey.asp">metaKey</a>

傳回當事件被觸發時，"meta" 鍵是否被按下。

<a href="http://www.w3school.com.cn/jsref/event_relatedtarget.asp">relatedTarget</a>

傳回與事件的目标節點相關的節點。

<a href="http://www.w3school.com.cn/jsref/event_screenx.asp">screenX</a>

傳回當某個事件被觸發時，滑鼠指針的水準坐标。

<a href="http://www.w3school.com.cn/jsref/event_screeny.asp">screenY</a>

傳回當某個事件被觸發時，滑鼠指針的垂直坐标。

<a href="http://www.w3school.com.cn/jsref/event_shiftkey.asp">shiftKey</a>

傳回當事件被觸發時，"SHIFT" 鍵是否被按下。

除了上面的滑鼠/事件屬性，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動态定位的最内層包容元素。

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

<a href="http://www.w3school.com.cn/jsref/event_bubbles.asp">bubbles</a>

傳回布爾值，訓示事件是否是起泡事件類型。

<a href="http://www.w3school.com.cn/jsref/event_cancelable.asp">cancelable</a>

傳回布爾值，訓示事件是否可擁可取消的預設動作。

<a href="http://www.w3school.com.cn/jsref/event_currenttarget.asp">currentTarget</a>

傳回其事件監聽器觸發該事件的元素。

<a href="http://www.w3school.com.cn/jsref/event_eventphase.asp">eventPhase</a>

傳回事件傳播的目前階段。

<a href="http://www.w3school.com.cn/jsref/event_target.asp">target</a>

傳回觸發此事件的元素（事件的目标節點）。

<a href="http://www.w3school.com.cn/jsref/event_timestamp.asp">timeStamp</a>

傳回事件生成的日期和時間。

<a href="http://www.w3school.com.cn/jsref/event_type.asp">type</a>

傳回目前 Event 對象表示的事件的名稱。

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

方法

<a href="http://www.w3school.com.cn/jsref/event_initevent.asp">initEvent()</a>

初始化新建立的 Event 對象的屬性。

<a href="http://www.w3school.com.cn/jsref/event_preventdefault.asp">preventDefault()</a>

通知浏覽器不要執行與事件關聯的預設動作。

<a href="http://www.w3school.com.cn/jsref/event_stoppropagation.asp">stopPropagation()</a>