您现在的位置是:网站首页> 编程资料编程资料
HTML5事件方法全部汇总HTML5实现的轻量级绘制SVG轮廓线路径动画插件特效源码html5 实现客户端验证上传文件的大小(简单实例)html5基于鼠标滚动控制植树生长动画特效源码【HTML5】Canvas绘制简单图片教程HTML5实现页面切换激活的PageVisibility API使用初探HTML5的Geolocation地理位置定位API使用教程HTML5中的强制下载属性download使用实例解析HTML5全屏响应式缩放切换幻灯片代码深入理解HTML的FormData对象
2021-08-31
1300人已围观
简介 下面小编就为大家带来一篇HTML5事件方法全部汇总。小编觉得挺不错的,现在分享给大家,也给大家做个参考,一起跟随小编过来看看吧
下面的表格列出了可插入 HTML 5 元素中以定义事件行为的标准事件属性。
- Window 事件属性 - Window Event Attributes
- 表单事件 - Form Events
- 键盘事件 - Keybord Events
- 鼠标事件 - Mouse Events
- 媒介事件 - Media Events
Window 事件属性
window 对象触发的事件。适用于
标签:| 属性 | 值 | 描述 |
|---|---|---|
| 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 内联框架iFrame推荐10个HTML5响应式框架五个2015 年最佳HTML5 框架深度剖析HTML的语意和与其相关的前端框架html悬浮框架的设置使用示例(iframe加载html)HTML教程,简单学习HTML语言(2)HTML框架_动力节点Java学院整理
- HTML5 Canvas绘制五星红旗html5实现的仿网页版微信聊天界面效果源码剖析标注HTML元素时class比id所具有的优势HTML表格布局实例讲解html5 canvas实现的3D飞行飞行动画特效源码关于html的下载功能详解HTML5+SVG实现水桶杯子打击乐器动画效果深入剖析HTML5 内联框架iFrameHTML5不同视觉差的页面特效源码 6种点击按钮文字变成input框,点击保存变成文字的实现代码
- 字中字效果的实现【html5实例】HTML5全屏响应式缩放切换幻灯片代码html5 canvas实现的“我们要发财了”游戏源码html5实现的仿网页版微信聊天界面效果源码详解HTML5中rel属性的prefetch预加载功能使用html5 canvas实现的3D飞行飞行动画特效源码HTML5+SVG实现水桶杯子打击乐器动画效果深入剖析HTML5 内联框架iFrameHTML5不同视觉差的页面特效源码 6种html5 canvas实现的酷炫全屏背景动画特效源码页面“线条”效果HTML5实现代码
- html5需遵循的6个设计原则HTML5 Canvas绘制五星红旗HTML5不同视觉差的页面特效源码 6种字中字效果的实现【html5实例】html5 canvas实现的酷炫全屏背景动画特效源码页面“线条”效果HTML5实现代码
- HTML5+Canvas+CSS3实现齐天大圣孙悟空腾云驾雾效果关于老式浏览器兼容HTML5和CSS3的问题HTML5结合CSS3实现的手动切换幻灯片动画特效源码一款利用html5和css3实现的3D立方体旋转效果教程 HTML5+CSS3图片堆叠转瀑布流布局特效源码html5+css3鼠标悬停hover超链接导航条特效源码 21种html5+css3实现的超酷雪花飘落特效源码用CSS3打造HTML5的Logo(实现代码)
- HTML5标签嵌套规则详解【必看】html标签的嵌套规则介绍HTML标签嵌套规则详细归纳适合新手朋友XHTML标签的嵌套规则分析HTML中的块级、行级元素,特殊字符,嵌套规则
- HTML 5.1来了 9月份正式发布 更新内容预览HTML5 Canvas绘制五星红旗HTML5不同视觉差的页面特效源码 6种字中字效果的实现【html5实例】html5 canvas实现的酷炫全屏背景动画特效源码页面“线条”效果HTML5实现代码
- 浅析HTML5中header标签的用法HTML标签meta总结,HTML5 head meta 属性整理html5+css3之制作header实例与更新html5+css3之CSS中的布局与Header的实现html5小技巧之通过document.head获取head元素html5理解head_动力节点Java学院整理
- 基于HTML5 的人脸识别活体认证的实现方法html5+jQuery+bootstrap实现的QQ空间时间轴界面特效源码html5+jQuery实现的点击text文本框个性化时间选择插件源码调用HTML5的Canvas API绘制图形的快速入门指南HTML5结合3D实现的多图案例展示特效源码html5 canvas绘制矩形和圆形的实例代码用CSS3打造HTML5的Logo(实现代码)
- 调用HTML5的Canvas API绘制图形的快速入门指南深入解析HTML5 Canvas控制图形矩阵变换的方法实例讲解利用HTML5 Canvas API操作图形旋转的方法HTML5 Canvas 绘图——使用 Canvas 绘制图形图文教程 使用html5 canvahtml5的画布canvas——画出弧线、旋转的图形实例代码+效果图html5-Canvas可以在web中绘制各种图形H5最强接口之canvas实现动态图形功能
