HTML5 事件
下面的表格列出了可插入 HTML 5 元素中以定义事件行为的标准事件属性。
- Window 事件属性 - Window Event Attributes
- 表单事件 - Form Events
- 键盘事件 - Keybord Events
- 鼠标事件 - Mouse Events
- 媒介事件 - Media Events
Window 事件属性
window 对象触发的事件。
适用于 <body> 标签:
| 属性 | 值 | 描述 |
|---|---|---|
| onafterprint | script | 在打印文档之后运行脚本 |
| onbeforeprint | script | 在文档打印之前运行脚本 |
| onbeforeonload | script | 在文档加载之前运行脚本 |
| onblur | script | 当窗口失去焦点时运行脚本 |
| onerror | script | 当错误发生时运行脚本 |
| onfocus | script | 当窗口获得焦点时运行脚本 |
| onhaschange | script | 当文档改变时运行脚本 |
| onload | script | 当文档加载时运行脚本 |
| onmessage | script | 当触发消息时运行脚本 |
| onoffline | script | 当文档离线时运行脚本 |
| ononline | script | 当文档上线时运行脚本 |
| onpagehide | script | 当窗口隐藏时运行脚本 |
| onpageshow | script | 当窗口可见时运行脚本 |
| onpopstate | script | 当窗口历史记录改变时运行脚本 |
| onredo | script | 当文档执行再执行操作(redo)时运行脚本 |
| onresize | script | 当调整窗口大小时运行脚本 |
| onstorage | script | 当文档加载加载时运行脚本 |
| onundo | script | 当 Web Storage 区域更新时(存储空间中的数据发生变化时) |
| onunload | script | 当用户离开文档时运行脚本 |
表单事件
由 HTML 表单内部的动作触发的事件。
适用于所有 HTML 5 元素,不过最常用于表单元素中:
| 属性 | 值 | 描述 |
|---|---|---|
| onblur | script | 当元素失去焦点时运行脚本 |
| onchange | script | 当元素改变时运行脚本 |
| oncontextmenu | script | 当触发上下文菜单时运行脚本 |
| onfocus | script | 当元素获得焦点时运行脚本 |
| onformchange | script | 当表单改变时运行脚本 |
| onforminput | script | 当表单获得用户输入时运行脚本 |
| oninput | script | 当元素获得用户输入时运行脚本 |
| oninvalid | script | 当元素无效时运行脚本 |
| onreset | script | 当表单重置时运行脚本。HTML 5 不支持。 |
| onselect | script | 当选取元素时运行脚本 |
| onsubmit | script | 当提交表单时运行脚本 |
键盘事件
由键盘触发的事件。
适用于所有 HTML 5 元素:
| 属性 | 值 | 描述 |
|---|---|---|
| onkeydown | script | 当按下按键时运行脚本 |
| onkeypress | script | 当按下并松开按键时运行脚本 |
| onkeyup | script | 当松开按键时运行脚本 |
鼠标事件
由鼠标或相似的用户动作触发的事件。
适用于所有 HTML 5 元素:
| 属性 | 值 | 描述 |
|---|---|---|
| onclick | script | 当单击鼠标时运行脚本 |
| ondblclick | script | 当双击鼠标时运行脚本 |
| ondrag | script | 当拖动元素时运行脚本 |
| ondragend | script | 当拖动操作结束时运行脚本 |
| ondragenter | script | 当元素被拖动至有效的拖放目标时运行脚本 |
| ondragleave | script | 当元素离开有效拖放目标时运行脚本 |
| ondragover | script | 当元素被拖动至有效拖放目标上方时运行脚本 |
| ondragstart | script | 当拖动操作开始时运行脚本 |
| ondrop | script | 当被拖动元素正在被拖放时运行脚本 |
| onmousedown | script | 当按下鼠标按钮时运行脚本 |
| onmousemove | script | 当鼠标指针移动时运行脚本 |
| onmouseout | script | 当鼠标指针移出元素时运行脚本 |
| onmouseover | script | 当鼠标指针移至元素之上时运行脚本 |
| onmouseup | script | 当松开鼠标按钮时运行脚本 |
| onmousewheel | script | 当转动鼠标滚轮时运行脚本 |
| onscroll | script | 当滚动元素滚动元素的滚动条时运行脚本 |
媒介事件
由视频、图像以及音频等媒介触发的事件。
适用于所有 HTML 5 元素,不过在媒介元素(诸如 audio、embed、img、object 以及 video)中最常用:
| 属性 | 值 | 描述 |
|---|---|---|
| onabort | script | 当发生中止事件时运行脚本 |
| oncanplay | script | 当媒介能够开始播放但可能因缓冲而需要停止时运行脚本 |
| oncanplaythrough | script | 当媒介能够无需因缓冲而停止即可播放至结尾时运行脚本 |
| ondurationchange | script | 当媒介长度改变时运行脚本 |
| onemptied | script | 当媒介资源元素突然为空时(网络错误、加载错误等)运行脚本 |
| onended | script | 当媒介已抵达结尾时运行脚本 |
| onerror | script | 当在元素加载期间发生错误时运行脚本 |
| onloadeddata | script | 当加载媒介数据时运行脚本 |
| onloadedmetadata | script | 当媒介元素的持续时间以及其他媒介数据已加载时运行脚本 |
| onloadstart | script | 当浏览器开始加载媒介数据时运行脚本 |
| onpause | script | 当媒介数据暂停时运行脚本 |
| onplay | script | 当媒介数据将要开始播放时运行脚本 |
| onplaying | script | 当媒介数据已开始播放时运行脚本 |
| onprogress | script | 当浏览器正在取媒介数据时运行脚本 |
| onratechange | script | 当媒介数据的播放速率改变时运行脚本 |
| onreadystatechange | script | 当就绪状态(ready-state)改变时运行脚本 |
| onseeked | script | 当媒介元素的定位属性 [1] 不再为真且定位已结束时运行脚本 |
| onseeking | script | 当媒介元素的定位属性为真且定位已开始时运行脚本 |
| onstalled | script | 当取回媒介数据过程中(延迟)存在错误时运行脚本 |
| onsuspend | script | 当浏览器已在取媒介数据但在取回整个媒介文件之前停止时运行脚本 |
| ontimeupdate | script | 当媒介改变其播放位置时运行脚本 |
| onvolumechange | script | 当媒介改变音量亦或当音量被设置为静音时运行脚本 |
| onwaiting | script | 当媒介已停止播放但打算继续播放时运行脚本 |
[1]:定位属性的英文译文是:seeking attribute。
HTML5 事件的更多相关文章
- HTML5事件
Html5事件 contextmenu事件 用以表示何时应该显示上下文菜单,以便开发人员取消默认的上下文菜单而提供自定义的菜单. 由于此事件时冒泡的,因此可以为document指定一个事件处理程序,用 ...
- HTML5事件—visibilitychange 页面可见性改变事件
转:https://blog.csdn.net/yusirxiaer/article/details/73480916 又看到一个很有意思的HTML5事件 visibilitychange事件是浏览器 ...
- HTML5事件-pageshow 和 pagehide
<!doctype html> <html> <head> <title>html5事件</title> <meta charset= ...
- JavaScript 事件——“事件类型”中“HTML5事件”的注意要点
contextmenu事件 该事件用以表示何时应该显示上下文菜单,以便开发者取消默认的上下文菜单,转而提供自定义的菜单. 因为该事件属于鼠标事件,所以其事件对象中包含与光标位置有关的所有属性.如: & ...
- Javascript高级编程学习笔记(67)—— 事件(11)HTML5事件
DOM规范没有涵盖所有浏览器支持的所有事件 而许多浏览器出于满足用户需求,或解决特殊问题的目的,实现了一些自定义事件 HTML5列出了浏览器应该支持的所有事件,这里只讨论得到浏览器完善支持的事件(并非 ...
- JavaScript HTML5事件
有3个页面级事件在HTML5版本中被引入. 事件 说明 DOMContentLoaded 在DOM树形成后触发(与此同时,图片.CSS和JavaScript可能还在加载).在这个事件中,脚本运 ...
- HTML5事件——contextmenu 隐藏鼠标右键菜单
在window中单击右键或在Mac中Ctrl+单击时会触发contextmenu事件,通过取消其默认动作能够提供自己定义菜单. 首先先写一个自己的菜单: <style> ul, li { ...
- HTML5事件-自定义右键菜单
WEB领域中,为实现上下文菜单,开发人员面临的主要问题是如何确定应该显示这个上下文菜单(Windows 中,右键单击:Mac 中,Ctrl+单击), 以及如何屏蔽与该操作相关联的默认上下文菜单. 解决 ...
- HTML5 Cheat sheet PNG帮助手册(标签、事件、兼容)
HTML5 Cheat sheet PNG帮助手册(标签.事件.兼容) 1.HTML5标签 2.HTML5事件 3.HTML5兼容 最新HTML5手册资料请参考:http://www.inmotion ...
随机推荐
- 将四个BYTE数值转换成IEEE754标准的浮点数(两种方法:用Addr函数取字节数字的首地址,或者用Absolute关键字)
在工作中,经常使用到IEEE754格式的数据.IEEE754格式的数据占四个字节,好像Motorola格式和Intel格式的还不一样. 由于工作中很少和他打交道(使用的软件内部已经处理),就没太在意. ...
- ollicle.com: Biggerlink – jQuery plugin
ollicle.com: Biggerlink – jQuery plugin Biggerlink – jQuery plugin Purpose Demo Updated for jQuery 1 ...
- move.js
function startMove(obj,json,fn){ var flag=true;//标志所有运动是否到达目标值 clearInterval(obj.timer); obj.timer=s ...
- 编译器DIY——词法分析
在上一篇文章中已经介绍了读文件的操作,那么这一篇文章中将会细致解释词法分析. 在源文件里解析出的单词流必须识别为保留字,标识符,常量,操作符和界符五大类 1.显然我们须要列举出全部的保留字,而这里与保 ...
- Asp.net 提供程序模型
需要说明一下几点 1.什么是提供程序? 2.ASP.NET 4.5 中的提供程序 3.配置提供程序 有一下几种存储状态的方式 1.应用程序状态 2.会话状态 3.高速缓存状态 4.cookie 5.查 ...
- JS+canvas实现人机大战之五子棋
效果图: html代码如下: <!DOCTYPE html><html> <head> <meta charset="utf-8 ...
- UICollectionView在Swift3.0中的用法
UICollectionView在Swift3.0中的用法 UICollectionView的初始化跟OC中是相似的,创建 GameView 集成自 UICollectionView .注意不同于UI ...
- C part 1 -- 指令篇
Windows系统的cmd(command命令行工具): Shutdown -s -t 600:表示600秒后自动关机 Shutdown -a :可取消定时关机 Shutdown -r -t 600: ...
- [LeetCode]题解(python):087-Scramble String
题目来源: https://leetcode.com/problems/scramble-string/ 题意分析: 给定一个字符串,字符串展成一个二叉树,如果二叉树某个或多个左右子树颠倒得到的新字符 ...
- IOS 使用IOS6苹果地图
IOS应用程序中使用Map Kit API开发地图应用程序.其核心是MKMapView类的使用.我们可以设置地图显示方式,控制地图,可以在地图上添加标注. 1.显示地图 在Map Kit API中显示 ...