Latest web development tutorials

HTML 事件

全局事件屬性

HTML 4 的新特性之一是可以使HTML 事件觸發瀏覽器中的行為,比方說當用戶點擊某個HTML 元素時啟動一段JavaScript。

如果你想學習更多關於事件屬性,請訪問JavaScript教程

下面的表格提供了標準的事件屬性,可以把它們插入HTML/XHTML 元素中,以定義事件行為。

New : HTML5新增屬性事件。


窗口事件屬性(Window Event Attributes)

由窗口觸發該事件(適用於<body> 標籤):

屬性 描述
onafterprint New script 在打印文檔之後運行腳本
onbeforeprint New script 在文檔打印之前運行腳本
onbeforeonload New script 在文檔加載之前運行腳本
onblur script 當窗口失去焦點時運行腳本
onerror New script 當錯誤發生時運行腳本
onfocus script 當窗口獲得焦點時運行腳本
onhaschange New script 當文檔改變時運行腳本
onload script 當文檔加載時運行腳本
onmessage New script 當觸發消息時運行腳本
onoffline New script 當文檔離線時運行腳本
ononline New script 當文檔上線時運行腳本
onpagehide New script 當窗口隱藏時運行腳本
onpageshow New script 當窗口可見時運行腳本
onpopstate New script 當窗口歷史記錄改變時運行腳本
onredo New script 當文檔執行再執行操作(redo)時運行腳本
onresize New script 當調整窗口大小時運行腳本
onstorage New script 當Web Storage 區域更新時(存儲空間中的數據發生變化時)運行腳本
onundo New script 當文檔執行撤銷時運行腳本
onunload New script 當用戶離開文檔時運行腳本


表單事件(Form Events)

表單事件在HTML表單中觸發(適用於所有HTML 元素, 但該HTML元素需在form表單內):

屬性 描述
onblur script 當元素失去焦點時運行腳本
onchange script 當元素改變時運行腳本
oncontextmenu New script 當觸發上下文菜單時運行腳本
onfocus script 當元素獲得焦點時運行腳本
onformchange New script 當表單改變時運行腳本
onforminput New script 當表單獲得用戶輸入時運行腳本
oninput New script 當元素獲得用戶輸入時運行腳本
oninvalid New script 當元素無效時運行腳本
onreset script 當表單重置時運行腳本。 HTML 5不支持。
onselect script 當選取元素時運行腳本
onsubmit script 當提交表單時運行腳本


鍵盤事件(Keyboard Events)

屬性 描述
onkeydown script 當按下按鍵時運行腳本
onkeypress script 當按下並鬆開按鍵時運行腳本
onkeyup script 當鬆開按鍵時運行腳本


鼠標事件(Mouse Events)

通過鼠標觸發事件, 類似用戶的行為:

屬性 描述
onclick script 當單擊鼠標時運行腳本
ondblclick script 當雙擊鼠標時運行腳本
ondrag New script 當拖動元素時運行腳本
ondragend New script 當拖動操作結束時運行腳本
ondragenter New script 當元素被拖動至有效的拖放目標時運行腳本
ondragleave New script 當元素離開有效拖放目標時運行腳本
ondragover New script 當元素被拖動至有效拖放目標上方時運行腳本
ondragstart New script 當拖動操作開始時運行腳本
ondrop New script 當被拖動元素正在被拖放時運行腳本
onmousedown script 當按下鼠標按鈕時運行腳本
onmousemove script 當鼠標指針移動時運行腳本
onmouseout script 當鼠標指針移出元素時運行腳本
onmouseover script 當鼠標指針移至元素之上時運行腳本
onmouseup script 當鬆開鼠標按鈕時運行腳本
onmousewheel New script 當轉動鼠標滾輪時運行腳本
onscroll New script 當滾動元素的滾動條時運行腳本


多媒體事件(Media Events)

通過視頻(videos),圖像(images)或者音頻(audio) 觸發該事件,多應用於HTML媒體元素比如<audio>, <embed>, <img>, <object>, 和<video>):

屬性 描述
onabort script 當發生中止事件時運行腳本
oncanplay New script 當媒介能夠開始播放但可能因緩衝而需要停止時運行腳本
oncanplaythrough New script 當媒介能夠無需因緩衝而停止即可播放至結尾時運行腳本
ondurationchange New script 當媒介長度改變時運行腳本
onemptied New script 當媒介資源元素突然為空時(網絡錯誤、加載錯誤等)運行腳本
onended New script 當媒介已抵達結尾時運行腳本
onerror New script 當在元素加載期間發生錯誤時運行腳本
onloadeddata New script 當加載媒介數據時運行腳本
onloadedmetadata New script 當媒介元素的持續時間以及其他媒介數據已加載時運行腳本
onloadstart New script 當瀏覽器開始加載媒介數據時運行腳本
onpause New script 當媒介數據暫停時運行腳本
onplay New script 當媒介數據將要開始播放時運行腳本
onplaying New script 當媒介數據已開始播放時運行腳本
onprogress New script 當瀏覽器正在取媒介數據時運行腳本
onratechange New script 當媒介數據的播放速率改變時運行腳本
onreadystatechange New script 當就緒狀態(ready-state)改變時運行腳本
onseeked New script 當媒介元素的定位屬性[1] 不再為真且定位已結束時運行腳本
onseeking New script 當媒介元素的定位屬性為真且定位已開始時運行腳本
onstalled New script 當取回媒介數據過程中(延遲)存在錯誤時運行腳本
onsuspend New script 當瀏覽器已在取媒介數據但在取回整個媒介文件之前停止時運行腳本
ontimeupdate New script 當媒介改變其播放位置時運行腳本
onvolumechange New script 當媒介改變音量亦或當音量被設置為靜音時運行腳本
onwaiting New script 當媒介已停止播放但打算繼續播放時運行腳本

其他事件

屬性 描述
onshow New script 當<menu> 元素在上下文顯示時觸發
ontoggle New script 當用戶打開或關閉<details> 元素時觸發