HTML5 事件属性
HTML5 事件属性是全局的,可以应用于大多数元素。
HTML5 中的事件属性
以下事件属性可以应用于大多数元素以在某些事件发生时执行 JavaScript,但一些不相关的例外情况除外,例如在 <head>
部分中找到的元素,例如 <title>
, <base>
, <link>
等
窗口事件
window
对象相关的事件(适用于 <body>
标签):
属性 | 值 | 说明 |
---|---|---|
onafterprint | script | 在打印相关文档后触发。 |
onbeforeprint | script | 在打印相关文档之前触发。 |
onbeforeunload | script | 在卸载文档之前触发。 |
onerror | script | 发生文档错误时触发。 |
onhashchange | script | 当文档 URL 的片段标识符部分(即符号 (#) 后面的部分)发生更改时触发。 |
onload | script | 当文档完成加载时触发。 |
onmessage | script | 当消息事件发生时触发,即当用户发送跨文档消息或从具有 postMessage() 方法的工作人员发送消息时。 请参阅 HTML5 Web Workers。 |
onoffline | script | 当网络连接失败并且浏览器开始离线工作时触发。 |
ononline | script | 当网络连接恢复并且浏览器开始在线工作时触发。 |
onpagehide | script | 当页面隐藏时触发,例如当用户移动到另一个网页时。 |
onpageshow | script | 在页面显示时触发,例如当用户导航到网页时。 |
onpopstate | script | 对活动历史进行更改时触发。 |
onresize | script | 在调整浏览器窗口大小时触发。 |
onstorage | script | 当 网络存储 区域更新时触发。 |
onunload | script | 在卸载文档或关闭浏览器窗口之前立即触发。 |
表单事件
由于用户与 HTML 表单控件交互而发生的事件。
属性 | 值 | 说明 |
---|---|---|
onblur | script | 当元素失去焦点时触发。 |
onchange | script | 当元素的值或状态改变时触发。 |
onfocus | script | 当元素获得焦点时触发。 |
oninput | script | 当用户更改元素的值时触发。 |
oninvalid | script | 当可提交元素在表单验证期间不满足其约束时触发。 |
onreset | script | 当用户重置表单时触发。 |
onselect | script | 在选择某些文本或用户更改当前选择时触发。 |
onsearch | script | 当用户在 search 输入字段中写入内容时触发。 |
onsubmit | script | 提交表单时触发。 |
鼠标事件
由于用户与鼠标等指点设备交互而发生的事件:
属性 | 值 | 说明 |
---|---|---|
onclick | script | 当用户在元素上单击鼠标左键时触发。 |
ondblclick | script | 当用户双击元素时触发。 |
oncontextmenu | script | 当用户通过右键单击元素触发上下文菜单时触发。 |
ondrag | script | 当用户拖动元素时触发。 ondrag 事件在整个拖动操作中触发。 |
ondragend | script | 当用户在拖动操作结束时释放鼠标按钮时触发。 |
ondragenter | script | 当用户将元素拖动到有效的放置目标时触发。 |
ondragleave | script | 当元素在拖动操作期间离开有效的放置目标时触发。 |
ondragover | script | 当元素被拖动到有效的放置目标上时触发。 |
ondragstart | script | 当用户开始拖动文本选择或选定元素时触发。 |
ondrop | script | 在拖放操作期间释放鼠标按钮时触发,即当拖放被拖动的元素时。 |
onmousedown | script | 当鼠标按钮在元素上按下时触发。 |
onmousemove | script | 当用户将鼠标指针移到元素上时触发。 |
onmouseout | script | 当用户将鼠标指针移到元素边界之外时触发。 |
onmouseover | script | 当用户将鼠标指针移动到元素上时触发。 |
onmouseup | script | 当用户在鼠标悬停在元素上时释放鼠标按钮时触发。 |
onmousewheel | script | Deprecated 请改用 onwheel 属性。 |
onscroll | script | 当用户通过滚动元素的滚动条来滚动元素的内容时触发。 |
onshow | script | 当 contextmenu 事件被触发到具有 contextmenu 属性的元素时触发。 |
ontoggle | script | 当用户打开或关闭 <details> 元素时触发。 |
onwheel | script | 当用户通过在元素上向上或向下滚动鼠标滚轮来滚动元素的内容时触发。 |
键盘事件
用户与键盘交互发生的事件:
属性 | 值 | 说明 |
---|---|---|
onkeydown | script | 当用户按键时触发。 |
onkeypress | script | 当用户按下字母数字键时触发。 |
onkeyup | script | 当用户释放一个键时触发。 |
剪贴板事件
剪贴板修改相关事件,即复制、剪切和粘贴:
属性 | 值 | 说明 |
---|---|---|
oncopy | script | 当用户复制元素或选择并将其添加到系统剪贴板时触发。 |
oncut | script | 当元素或选择从文档中移除并添加到系统剪贴板时触发。 |
onpaste | script | 当用户粘贴数据时触发,将数据从系统剪贴板传输到文档。 |
媒体事件
处理嵌入在 HTML 文档中的媒体元素(例如 <audio>
和 <video>
元素)时发生的事件:
属性 | 值 | 说明 |
---|---|---|
onabort | script | 在播放中止时触发,但不是由于错误。 |
oncanplay | script | 当有足够的数据可用于播放媒体时触发,至少几帧,但需要进一步缓冲。 |
oncanplaythrough | script | 当整个媒体可以播放到最后而无需停止以进行进一步缓冲时触发。 |
oncuechange | script | 当 <track> 元素中的文本轨道提示发生变化时触发。 |
ondurationchange | script | 当媒体的持续时间改变时触发。 |
onemptied | script | 当媒体元素重置为其初始状态时触发,无论是因为加载期间的致命错误,还是因为调用 load() 方法来重新加载它。 |
onended | script | 播放结束时触发。 |
onerror | script | 在获取媒体数据时发生错误时触发。 |
onloadeddata | script | 在当前播放位置加载媒体数据时触发。 |
onloadedmetadata | script | 当媒体的元数据(如持续时间和尺寸)完成加载时触发。 |
onloadstart | script | 开始加载媒体时触发。 |
onpause | script | 在用户或以编程方式暂停播放时触发。 |
onplay | script | 在暂停后开始播放媒体时触发,即请求 play() 方法时。 |
onplaying | script | 当音频或视频开始播放时触发。 |
onprogress | script | 定期触发以指示下载媒体数据的进度。 |
onratechange | script | 当播放速率或速度增加或减少时触发,例如慢动作或快进模式。 |
onseeked | script | 在查找操作结束时触发。 |
onseeking | script | 当前播放位置移动时触发。 |
onstalled | script | 当下载意外停止时触发。 |
onsuspend | script | 当媒体的加载被有意停止时触发。 |
ontimeupdate | script | 当播放位置改变时触发,例如当用户快进到不同的播放位置时。 |
onvolumechange | script | 当音量改变或播放静音或取消静音时触发。 |
onwaiting | script | 当播放停止时触发,因为视频资源的下一帧不可用。 |
注意: 上述事件属性适用于所有 HTML 元素,尽管它们并非对所有元素都有用。 例如,只有媒体元素会收到浏览器触发的 volumechange 事件。
Advertisements