HTML DOM 事件
示例
在 HTML 中,onclick 是事件監聽器,myFunction 是事件處理器
<button onclick="myFunction()">點選我</button>
在 JavaScript 中,click 是事件,myFunction 是事件處理器
button.addEventListener("click", myFunction);
| 事件 |
發生時間 |
所屬 |
| abort |
媒體載入被中止 |
UiEvent, Event |
| afterprint |
頁面已開始列印 |
事件 |
| animationend |
CSS 動畫已完成 |
AnimationEvent |
| animationiteration |
CSS 動畫重複播放 |
AnimationEvent |
| animationstart |
CSS 動畫已開始 |
AnimationEvent |
| beforeprint |
頁面即將列印 |
事件 |
| beforeunload |
文件即將解除安裝之前 |
UiEvent, Event |
| blur |
元素失去焦點 |
FocusEvent |
| canplay |
瀏覽器可以開始播放媒體(已緩衝足夠開始播放) |
事件 |
| canplaythrough |
瀏覽器可以不中斷地播放媒體而無需緩衝 |
事件 |
| change |
表單元素的內容已更改 |
事件 |
| click |
元素被點選 |
MouseEvent |
| contextmenu |
元素被右鍵點選以開啟上下文選單 |
MouseEvent |
| copy |
元素內容被複制 |
ClipboardEvent |
| cut |
元素內容被剪下 |
ClipboardEvent |
| dblclick |
元素被雙擊 |
MouseEvent |
| drag |
元素正在被拖拽 |
DragEvent |
| dragend |
元素拖拽結束 |
DragEvent |
| dragenter |
被拖拽元素進入放置目標 |
DragEvent |
| dragleave |
被拖拽元素離開放置目標 |
DragEvent |
| dragover |
被拖拽元素在放置目標上方 |
DragEvent |
| dragstart |
元素拖拽開始 |
DragEvent |
| drop |
被拖拽元素被放置到目標上 |
DragEvent |
| durationchange |
媒體時長已更改 |
事件 |
| ended |
媒體已播放到末尾(“感謝收聽”) |
事件 |
| error |
載入檔案時發生錯誤 |
ProgressEvent, UiEvent, Event |
| focus |
元素獲得焦點 |
FocusEvent |
| focusin |
元素即將獲得焦點 |
FocusEvent |
| focusout |
元素即將失去焦點 |
FocusEvent |
| fullscreenchange |
元素以全屏模式顯示 |
事件 |
| fullscreenerror |
元素無法以全屏模式顯示 |
事件 |
| hashchange |
URL 的錨點部分已更改 |
HashChangeEvent |
| input |
元素獲得使用者輸入 |
InputEvent, Event |
| invalid |
元素無效 |
事件 |
| keydown |
按鍵按下 |
KeyboardEvent |
| keypress |
按鍵被按下 |
KeyboardEvent |
| keyup |
按鍵被釋放 |
KeyboardEvent |
| load |
物件已載入 |
UiEvent, Event |
| loadeddata |
媒體資料已載入 |
事件 |
| loadedmetadata |
元資料(如尺寸和時長)已載入 |
事件 |
| loadstart |
瀏覽器開始查詢指定的媒體 |
ProgressEvent |
| message |
透過事件源接收到訊息 |
事件 |
| mousedown |
滑鼠按鈕在元素上方被按下 |
MouseEvent |
| mouseenter |
指標移入元素 |
MouseEvent |
| mouseleave |
指標移出元素 |
MouseEvent |
| mousemove |
指標在元素上方移動 |
MouseEvent |
| mouseover |
指標移入元素 |
MouseEvent |
| mouseout |
指標移出元素 |
MouseEvent |
| mouseup |
使用者在元素上方釋放滑鼠按鈕 |
MouseEvent |
| mousewheel |
已棄用。 請改用 wheel 事件 |
WheelEvent |
| offline |
瀏覽器開始離線工作 |
事件 |
| online |
瀏覽器開始線上工作 |
事件 |
| open |
與事件源的連線已開啟 |
事件 |
| pagehide |
使用者從網頁導航離開 |
PageTransitionEvent |
| pageshow |
使用者導航到網頁 |
PageTransitionEvent |
| paste |
一些內容被貼上到元素中 |
ClipboardEvent |
| pause |
媒體暫停 |
事件 |
| play |
媒體已開始播放或不再暫停 |
事件 |
| playing |
媒體在暫停或緩衝後正在播放 |
事件 |
| popstate |
視窗歷史記錄已更改 |
PopStateEvent |
| progress |
瀏覽器正在下載媒體資料 |
事件 |
| ratechange |
媒體播放速度已更改 |
事件 |
| resize |
文件檢視已調整大小 |
UiEvent, Event |
| reset |
表單已重置 |
事件 |
| scroll |
捲軸正在滾動 |
UiEvent, Event |
| search |
搜尋欄位中寫入內容 |
事件 |
| seeked |
跳轉到媒體位置已完成 |
事件 |
| seeking |
跳轉到媒體位置已開始 |
事件 |
| select |
使用者選擇了一些文字 |
UiEvent, Event |
| show |
<menu> 元素顯示為上下文選單 |
事件 |
| stalled |
瀏覽器正在嘗試獲取不可用的媒體資料 |
事件 |
| storage |
Web Storage 區域已更新 |
StorageEvent |
| submit |
表單已提交 |
事件 |
| suspend |
瀏覽器故意不獲取媒體資料 |
事件 |
| timeupdate |
播放位置已更改(使用者移動到媒體中的不同位置) |
事件 |
| toggle |
使用者開啟或關閉 <details> 元素 |
事件 |
| touchcancel |
觸控被中斷 |
TouchEvent |
| touchend |
手指從觸控式螢幕上移開 |
TouchEvent |
| touchmove |
手指在螢幕上拖動 |
TouchEvent |
| touchstart |
手指放在觸控式螢幕上 |
TouchEvent |
| transitionend |
CSS 過渡已完成 |
TransitionEvent |
| unload |
頁面已解除安裝 |
UiEvent, Event |
| volumechange |
媒體音量已更改(包括靜音) |
事件 |
| waiting |
媒體暫停但預計會恢復(例如,緩衝) |
事件 |
| wheel |
滑鼠滾輪在元素上方向上或向下滾動 |
WheelEvent |
W3schools 學習路徑
跟蹤您的進度 - 免費!