HTML 事件属性
全局事件属性
HTML 能够让事件触发浏览器中的操作,例如当用户点击一个元素时启动一个 JavaScript。
要了解更多关于编程事件的信息,请访问我们的 JavaScript 教程。
下面是可添加到 HTML 元素中以定义事件操作的全局事件属性。
窗口事件属性
为 window 对象触发的事件(应用于 <body> 标签)
Attribute | 值 | 描述 |
---|---|---|
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 Storage 区域更新时运行的脚本 |
onunload | script | 页面卸载(或浏览器窗口关闭)后触发 |
表单事件
由 HTML 表单内的操作触发的事件(适用于几乎所有 HTML 元素,但最常用于表单元素)
Attribute | 值 | 描述 |
---|---|---|
onblur | script | 元素失去焦点时触发 |
onchange | script | 元素值更改时触发 |
oncontextmenu | script | 触发上下文菜单时运行的脚本 |
onfocus | script | 元素获得焦点时触发 |
oninput | script | 用户向元素输入内容时运行的脚本 |
oninvalid | script | 元素无效时运行的脚本 |
onreset | script | 表单中的重置按钮被点击时触发 |
onsearch | script | 在搜索字段(对于 <input="search">)中输入内容时触发 |
onselect | script | 元素中选择了一些文本后触发 |
onsubmit | script | 表单提交时触发 |
键盘事件
Attribute | 值 | 描述 |
---|---|---|
onkeydown | script | 用户按键时触发 |
onkeypress | script | 用户按下某个键时触发 |
onkeyup | script | 用户释放按键时触发 |
鼠标事件
Attribute | 值 | 描述 |
---|---|---|
onclick | script | 在元素上鼠标单击时触发 |
ondblclick | script | 在元素上鼠标双击时触发 |
onmousedown | script | 在元素上按下鼠标按钮时触发 |
onmousemove | script | 当鼠标指针在元素上方移动时触发 |
onmouseout | script | 鼠标指针移出元素范围时触发 |
onmouseover | script | 鼠标指针移到元素上方时触发 |
onmouseup | script | 在元素上释放鼠标按钮时触发 |
onmousewheel | script | 已弃用。 请使用 onwheel 属性代替 |
onwheel | script | 鼠标滚轮在元素上向上或向下滚动时触发 |
拖放事件
Attribute | 值 | 描述 |
---|---|---|
ondrag | script | 拖动元素时运行的脚本 |
ondragend | script | 拖动操作结束时运行的脚本 |
ondragenter | script | 将拖动的元素拖到有效放置目标时运行的脚本 |
ondragleave | script | 元素离开有效放置目标时运行的脚本 |
ondragover | script | 元素正在拖动到有效放置目标时运行的脚本 |
ondragstart | script | 拖动操作开始时运行的脚本 |
ondrop | script | 拖动元素被放置时运行的脚本 |
onscroll | script | 滚动元素滚动条时运行的脚本 |
剪贴板事件
Attribute | 值 | 描述 |
---|---|---|
oncopy | script | 用户复制元素内容时触发 |
oncut | script | 用户剪切元素内容时触发 |
onpaste | script | 用户在元素中粘贴内容时触发 |
媒体事件
由视频、图像和音频等媒体触发的事件(适用于所有 HTML 元素,但在媒体元素(如 <audio>、<embed>、<img>、<object> 和 <video>)中最为常见)。
提示: 有关更多信息,请参阅我们的 HTML 音频和视频 DOM 参考。
Attribute | 值 | 描述 |
---|---|---|
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 | 设置 seeking 属性为 false(表示寻找已结束)时运行的脚本 |
onseeking | script | 设置 seeking 属性为 true(表示寻找正在进行)时运行的脚本 |
onstalled | script | 无论何种原因,浏览器无法获取媒体数据时运行的脚本 |
onsuspend | script | 无论何种原因,在完全加载媒体数据之前停止获取媒体数据时运行的脚本 |
ontimeupdate | script | 播放位置发生改变时(例如当用户快进到媒体的不同点时)每次运行的脚本 |
onvolumechange | script | 每次音量改变时(包括将音量设置为“静音”)运行的脚本 |
onwaiting | script | 媒体暂停但预期会恢复时(例如当媒体暂停以缓冲更多数据时)运行的脚本 |
杂项事件
Attribute | 值 | 描述 |
---|---|---|
ontoggle | script | 用户打开或关闭 <details> 元素时触发 |