前言
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 元素时触发 |