HTML 能够让事件触发浏览器中的操作,例如当用户单击元素时启动 JavaScript。
下面是可以添加到 HTML 元素以定义事件操作的全局事件属性。
为 window 对象触发的事件(适用于 <body> 标签):
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| onafterprint | script | 打印文档后运行的脚本 |
| onbeforeprint | script | 在打印文档之前运行的脚本 |
| onbeforeunload | script | 即将卸载文档时运行的脚本 |
| onerror | script | 发生错误时要运行的脚本 |
| onhashchange | script | 当 URL 的锚部分发生更改时运行的脚本 |
| onload | script | 页面加载完成后触发 |
| onmessage | script | 触发消息时运行的脚本 |
| onoffline | script | 浏览器开始离线工作时运行的脚本 |
| ononline | script | 浏览器开始在线工作时运行的脚本 |
| onpagehide | script | 当用户离开页面时运行的脚本 |
| onpageshow | script | 当用户导航到页面时运行的脚本 |
| onpopstate | script | 窗口历史更改时运行的脚本 |
| onresize | script | 调整浏览器窗口大小时触发 |
| onstorage | script | 更新 Web 存储区域时运行的脚本 |
| onunload | script | 页面卸载(或浏览器窗口已关闭)时触发 |
由 HTML 表单中的操作触发的事件(适用于几乎所有 HTML 元素,但最常用于表单元素):
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| onblur | script | 在元素失去焦点时触发 |
| onchange | script | 当元素的值改变时触发 |
| oncontextmenu | script | 触发上下文菜单时运行的脚本 |
| onfocus | script | 当元素获得焦点时触发 |
| oninput | script | 当元素获得用户输入时运行的脚本 |
| oninvalid | script | 元素无效时运行的脚本 |
| onreset | script | 单击表单中的重置按钮时触发 |
| onsearch | script | 当用户在搜索字段中写入内容时触发 (<input="search">) |
| onselect | script | 在元素中选择了某些文本后触发 |
| onsubmit | script | 提交表单时触发 |
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| onkeydown | script | 当用户按下某个键时触发 |
| onkeypress | script | 当用户按下某个键时触发 |
| onkeyup | script | 当用户释放键时触发 |
由鼠标或类似用户动作触发的事件:
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| onclick | script | 鼠标点击元素时触发 |
| ondblclick | script | 鼠标双击元素触发 |
| onmousedown | script | 在元素上按下鼠标按钮时触发 |
| onmousemove | script | 当鼠标指针在元素上方移动时触发 |
| onmouseout | script | 当鼠标指针移出元素时触发 |
| onmouseover | script | 当鼠标指针移到元素上时触发 |
| onmouseup | script | 当在元素上释放鼠标按钮时触发 |
| onmousewheel | script | ⚠️ 已弃用。 改用 onwheel 属性 |
| onwheel | script | 当鼠标滚轮在元素上向上或向下滚动时触发 |
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| ondrag | script | 拖动元素时运行的脚本 |
| ondragend | script | 在拖动操作结束时运行的脚本 |
| ondragenter | script | 将元素拖到有效放置目标时运行的脚本 |
| ondragleave | script | 当元素离开有效放置目标时运行的脚本 |
| ondragover | script | 将元素拖到有效放置目标上时运行的脚本 |
| ondragstart | script | 在拖动操作开始时运行的脚本 |
| ondrop | script | 拖放拖动元素时运行的脚本 |
| onscroll | script | 滚动元素的滚动条时运行的脚本 |
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| oncopy | script | 当用户复制元素的内容时触发 |
| oncut | script | 当用户剪切元素的内容时触发 |
| onpaste | script | 当用户在元素中粘贴一些内容时触发 |
由视频、图像和音频等媒体触发的事件(适用于所有 HTML 元素,但最常见于媒体元素,如 <audio>、<embed>、<img>、<object> 和 <video>)。
提示:查看我们的 HTML Audio 和 Video DOM 参考 以获取更多信息。
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| onabort | script | 要在中止时运行的脚本 |
| oncanplay | script | 当文件准备好开始播放时运行的脚本(当它缓冲到足以开始播放时) |
| oncanplaythrough | script | 当文件可以一直播放到最后而不暂停缓冲时运行的脚本 |
| oncuechange | script | <track> 元素中提示发生变化时运行的脚本 |
| ondurationchange | script | 媒体长度改变时运行的脚本 |
| onemptied | script | 当发生不好的事情并且文件突然不可用(如意外断开连接)时运行的脚本 |
| onended | script | 媒体结束时运行的脚本(对于“感谢收听”等消息的有用事件) |
| onerror | script | 加载文件时发生错误时运行的脚本 |
| onloadeddata | script | 加载媒体数据时运行的脚本 |
| onloadedmetadata | script | 加载元数据(如维度和持续时间)时运行的脚本 |
| onloadstart | script | 在实际加载任何内容之前文件开始加载时运行的脚本 |
| onpause | script | 当媒体被用户或以编程方式暂停时运行的脚本 |
| onplay | script | 媒体准备好开始播放时运行的脚本 |
| onplaying | script | 媒体实际开始播放时运行的脚本 |
| onprogress | script | 当浏览器正在获取媒体数据时运行的脚本 |
| onratechange | script | 每次播放速率变化时运行的脚本(比如当用户切换到慢动作或快进模式时) |
| onseeked | script | 当 seek 属性设置为 false 时要运行的脚本,表示搜索已经结束 |
| onseeking | script | 当 seek 属性设置为 true 时要运行的脚本,表示正在搜索 |
| onstalled | script | 当浏览器由于某种原因无法获取媒体数据时运行的脚本 |
| onsuspend | script | 无论出于何种原因,在完全加载媒体数据之前停止获取媒体数据时运行的脚本 |
| ontimeupdate | script | 当播放位置改变时运行的脚本(比如当用户快进到媒体中的不同点时) |
| onvolumechange | script | 每次更改音量时要运行的脚本(包括将音量设置为静音 mute) |
| onwaiting | script | 当媒体暂停但预计会恢复时运行脚本(例如当媒体暂停以缓冲更多数据时) |
| 属性 Attribute | Value | 描述 Description |
|---|---|---|
| ontoggle | script | 当用户打开或关闭 <details> 元素时触发 |