前言
HTML DOM 事件允许 Javascript 在 HTML 文档元素中注册不同事件处理程序。
鼠标事件
| 事件名 | 描述 |
|---|---|
| onclick | 鼠标左键点击某个对象时触发。 |
| onmousedown | 鼠标按钮按下。 |
| onmouseup | 鼠标按键松开。 |
| ondblclick | 鼠标左键双击某个对象时触发。 |
| onmouseover | 鼠标移到某元素之上。 |
| onmouseout | 鼠标从某元素移开。 |
| onmouseenter | 鼠标移动到元素上时触发(该事件不冒泡) |
| onmouseleave | 鼠标移出元素时触发(该事件不冒泡) |
| onmousemove | 鼠标在元素上移动时触发。 |
| oncontextmenu | 用户点击鼠标右键打开上下文菜单时触发 |
键盘事件
| 事件名 | 描述 |
|---|---|
| onkeydown | 某个键盘按键被按下。 |
| onkeyup | 某个键盘按键被松开。 |
| onkeypress | 某个键盘按键被按下并松开。 |
表单事件
| 事件名 | 描述 |
|---|---|
| onfocus | 元素获取焦点时触发 |
| onblur | 元素失去焦点时触发 |
| onfocusin | 元素即将获取焦点时触发 |
| onfocusout | 元素即将失去焦点时触发 |
| onsearch | 用户向搜索域输入文本时触发 (input="search" ) |
| onchange | 表单元素的内容改变时触发( input, |
| onsubmit | 表单提交时触发 |
| oninput | 元素获取用户输入时触发 |
| onreset | 表单重置时触发 |
| onselect | 用户选取文本时触发 ( input 和 textarea) |
框架/对象( Frame / Object )事件
| 事件名 | 描述 |
|---|---|
| onload | 一张页面或一幅图像完成加载。 |
| onunload | 用户退出页面。 ( body 和 frameset) |
| onbeforeunload | 即将离开页面(刷新或关闭)时触发 |
| onpageshow | 用户访问页面时触发 |
| onpagehide | 用户离开当前网页跳转到另外一个页面时触发 |
| onscroll | 当文档被滚动时发生的事件。 |
| onresize | 窗口或框架被重新调整大小。 |
| onhashchange | 该事件在当前 URL 的锚部分发生修改时触发。 |
| onabort | 图像的加载被中断。 ( object) |
| onerror | 在加载文档或图像时发生错误。 ( object, body和 frameset) |
剪贴板事件
| 事件名 | 描述 |
|---|---|
| oncopy | 用户拷贝元素内容时触发 |
| onpaste | 用户粘贴元素内容时触发 |
| oncut | 用户剪切元素内容时触发 |
拖动事件
| 事件名 | 描述 |
|---|---|
| ondragstart | 用户开始拖动元素时触发 |
| ondragenter | 拖动的元素进入放置目标时触发 |
| ondragleave | 拖动元素离开放置目标时触发 |
| ondragover | 拖动元素在放置目标上时触发 |
| ondrag | 元素正在拖动时触发 |
| ondragend | 用户完成元素的拖动时触发 |
| ondrop | 拖动元素放置在目标区域时触发 |
多媒体( Media )事件
| 事件名 | 描述 |
|---|---|
| onplay | 视频/音频(audio/video)开始播放时触发。 |
| onpause | 视频/音频(audio/video)暂停时触发。 |
| onended | 视频/音频(audio/video)播放结束时触发。 |
| onprogress | 浏览器下载指定的视频/音频(audio/video)时触发。 |
| onratechange | 视频/音频(audio/video)的播放速度发生改变时触发。 |
| ontimeupdate | 当前的播放位置发生改变时触发。 |
| onvolumechange | 音量发生改变时触发。 |
| onwaiting | 视频由于要播放下一帧而需要缓冲时触发。 |
| onseeking | 用户开始重新定位视频/音频(audio/video)时触发。 |
| onseeked | 用户重新定位视频/音频(audio/video)的播放位置后触发。 |
| onloadstart | 浏览器开始寻找指定视频/音频(audio/video)触发。 |
| onloadeddata | 浏览器加载视频/音频(audio/video)当前帧时触发触发。 |
| onloadedmetadata | 指定视频/音频(audio/video)的元数据加载后触发。 |
| onplaying | 视频/音频(audio/video)暂停或者在缓冲后准备重新开始播放时触发。 |
| oncanplaythrough | 视频/音频(audio/video)可以正常播放且无需停顿和缓冲时触发。 |
| oncanplay | 用户可以开始播放视频/音频(audio/video)时触发。 |
| ondurationchange | 视频/音频(audio/video)的时长发生变化时触发。 |
| onstalled | 浏览器获取媒体数据,但媒体数据不可用时触发。 |
| onsuspend | 浏览器读取媒体数据中止时触发。 |
| onemptied | 当前播放列表为空时触发 |
| onabort | 视频/音频(audio/video)终止加载时触发。 |
| onerror | 视频/音频(audio/video)数据加载期间发生错误时触发。 |
动画事件
| 事件名 | 描述 |
|---|---|
| animationstart | CSS 动画开始播放时触发 |
| animationend | CSS 动画结束播放时触发 |
| animationiteration | CSS 动画重复播放时触发 |
过渡事件
| 事件名 | 描述 |
|---|---|
| transitionend | 在 CSS 完成过渡后触发。 |
其他事件
| 事件名 | 描述 |
|---|---|
| onmessage | 从对象(WebSocket, Web Worker, Event Source 或者子 frame 或父窗口)接收到消息时触发 |
| onwheel | 在鼠标滚轮在元素上下滚动时触发 |
| onmousewheel | 已废弃。 使用 onwheel 事件替代 |
| ononline | 浏览器开始在线工作时触发。 |
| onoffline | 浏览器开始离线工作时触发。 |
| onpopstate | 窗口的浏览历史(history 对象)发生改变时触发。 |
| onstorage | Web Storage(HTML 5 Web 存储)更新时触发 |
| onshow | 当 menu 元素在上下文菜单显示时触发 |
| ontoggle | 用户打开或关闭 details 元素时触发 |