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 ...
随机推荐
- es5 api
ES5 Object.create(prototype, descriptors) //创建对象 var o1 = {foo:'bar'}; var o2 = new Object(); //Obje ...
- 转: mysql create view 创建视图
以下的文章主要是对MySQL视图的描述,其中包括MySQ视图L概述,以及创建MySQL视图-create view与修改MySQL视图--alter view等相关内容的具体描述,以下就是文章的具体内 ...
- 转：CSS Overflow 属性
原文:CSS Overflow 属性译自:The CSS Overflow Property版权所有,转载请注明出处,多谢!! 根据CSS的盒模型概念,页面中的每个元素,都是一个矩形的盒子.这些盒子的 ...
- Fastboot的使用简单教程
大家都知道HTC手机重新启动进入所谓的project模式,就是HBOOT,然后能够进入FASTBOOT界面,在这个界面.我们能够在电脑端能够做非常多事,特别是HBOOT被改动过,假设是ENG S-OF ...
- Swift 中类的初始化器与继承
首先,Swift 为类定义了两种初始化器来确保类中所有的储存属性都能得到一个初始化值.这两种初始化器就是「指定初始化器」(Designated Initializer)与「便利初始化器」(Conven ...
- iOS面试题02-数据存储
1.如果后期需要增加数据库中的字段怎么实现,如果不使用CoreData呢? 回答:编写SQL语句来操作原来表中的字段 1>增加表字段 ALETER TABLE 表名 ADD COLUMN 字段名 ...
- ThinkPHP第十七天(隐藏index.php和简短路径配置)
1.路由设置,让路径中不显示index.php方法: 第一步:在apache中的httpd.conf中查找: LoadModule rewrite_module modules/mod_rewrite ...
- [LeetCode]题解（python）：075-Sort Colors
题目来源: https://leetcode.com/problems/sort-colors/ 题意分析: 给定n个颜色,红色,白色和蓝色.分别用0,1,2代替,将这些颜色排序,0在1前,1在2前. ...
- django分页linaro-django-pagination
1.安装linaro-django-pagination settings INSTALLED_APPS = ( # ... 'linaro_django_pagination', ) MIDDLEW ...
- 基于Visual C++2013拆解世界五百强面试题--题8-数组的排序和查找
用三种方法实现对一个数组的排序,并设计一个函数实现数的查找,要求时间越短越好,空间占用越少越好. 对数组排序的方法很多,我们选比较常用和容易的三种排序,直接插入排序,冒泡排序和快速排序. 直接插入排序 ...