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> 元素時觸發 |