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 学习路径
跟踪您的进度 - 免费!