相关文章推荐
重情义的刺猬  ·  產生 OpenAPI 文件 | ...·  3 周前    · 
健壮的苦咖啡  ·  XMind如何快速插入超链接并设置样式?_编 ...·  2 周前    · 
英姿勃勃的伤疤  ·  Qt事件系统深入解析事件分发传播过滤与自定义 ...·  2 周前    · 
痴情的啄木鸟  ·  如何禁用三星S24U系统自动更新?_编程语言 ...·  2 周前    · 
年轻有为的香烟  ·  浏览器事件开发者社区·  1 周前    · 
大鼻子的盒饭  ·  android ...·  10 月前    · 
傻傻的荒野  ·  转载,(无法从传输中读取数据 ) - ...·  1 年前    · 
爱运动的口罩  ·  公安部A级通缉令在逃人员投案自首:涉盗掘古墓 ...·  2 年前    · 
飘逸的领结  ·  Ingress 控制器 | Kubernetes·  2 年前    · 
豪情万千的围巾  ·  c# - XmlSerializer: ...·  2 年前    · 
Code  ›  浏览器事件开发者社区
软件
https://cloud.tencent.com/developer/article/1687886
年轻有为的香烟
1 周前
WindRunnerMax

浏览器事件

腾讯云
开发者社区
文档 建议反馈 控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
WindRunnerMax
社区首页 > 专栏 > 浏览器事件

浏览器事件

作者头像
WindRunnerMax
发布 于 2020-08-27 10:30:26
发布 于 2020-08-27 10:30:26
3.5K 0
举报
文章被收录于专栏: Czy‘s Blog Czy‘s Blog

浏览器事件

常用浏览器事件与 DOM 事件,包括鼠标事件、键盘事件、框架/对象事件、表单事件、剪贴板事件、打印事件、拖动事件、多媒体事件、动画事件、过渡事件。

浏览器事件

加载相关

  • onbeforeunload : 该事件在即将离开页面(刷新或关闭)时触发。
  • onload : 文档加载完成后触发。
  • onunload : 当窗口卸载其内容和资源时触发。
  • onerror : 当发生 JavaScript 运行时错误与资源加载失败时触发。
  • onabort : 发送到 window 的中止 abort 事件的事件处理程序,不适用于 Firefox 2 或 Safari 。

窗口相关

  • onblur : 窗口失去焦点时触发。
  • onfocus : 窗口获得焦点时触发。
  • onresize : 窗口大小发生改变时触发。
  • onscroll : 窗口发生滚动时触发。
  • onmessage : 窗口对象接收消息事件时触发。
  • onchange : 窗口内表单元素的内容改变时触发。
  • oninput : 窗口内表单元素获取用户输入时触发。
  • onreset : 窗口内表单重置时触发。
  • onselect : 窗口内表单元素中文本被选中时触发。
  • onsubmit : 窗口内表单中 submit 按钮被按下触发。
  • onhashchange : 当窗口的锚点哈希值发生变化时触发。

鼠标相关

  • onclick : 当点击页面时触发。
  • onmouseup : 鼠标按键被松开时触发。
  • ondblclick : 当双击页面时调用事件句柄。
  • oncontextmenu : 在点击鼠标右键打开上下文菜单时触发。
  • onmousedown : 鼠标按钮被按下时触发。
  • onmousemove : 当移动鼠标时触发。
  • onmouseout : 鼠标移出窗口时触发。
  • onmouseover : 鼠标移动到窗口时触发。
  • onauxclick : 指示在输入设备上按下非主按钮时触发,例如鼠标中键。

键盘相关

  • onkeydown : 某个键盘按键被按下时触发。
  • onkeyup : 某个键盘按键被松开后触发。
  • onkeypress : 某个键盘按键被按下并松开后触发。

动画相关

  • onanimationcancel : 当 CSS 动画意外中止时,即在任何时候它停止运行而不发送 animationend 事件时将发送此事件,例如当 animation-name 被改变,动画被删除等
  • onanimationend : 当 CSS 动画到达其活动周期的末尾时,按照 (animation-duration*animation-iteration-count) + animation-delay 进行计算,将发送此事件。
  • onanimationiteration : 此事件将会在 CSS 动画到达每次迭代结束时触发,当通过执行最后一个动画步骤完成对动画指令序列的单次传递完成时,迭代结束。

设备相关

  • ondevicemotion : 设备状态发生改变时触发
  • ondeviceorientation : 设备相对方向发生改变时触发
  • ondeviceproximity : 当设备传感器检测到物体变得更接近或更远离设备时触发。

打印相关

  • onbeforeprint : 该事件在页面即将开始打印时触发
  • onafterprint : 该事件在页面已经开始打印或者打印窗口已经关闭时触发。

应用相关

  • onappinstalled : 一旦将 Web 应用程序成功安装为渐进式 Web 应用程序,该事件就会被分派。
  • onbeforeinstallprompt : 当用户即将被提示安装 web 应用程序时,该处理程序将在设备上调度,其相关联的事件可以保存以供稍后用于在更适合的时间提示用户。

DOM事件

鼠标相关

  • onclick : 当用户点击某个对象时调用的事件句柄。
  • oncontextmenu : 在用户点击鼠标右键打开上下文菜单时触发
  • ondblclick : 当用户双击某个对象时调用的事件句柄。
  • onmousedown : 鼠标按钮被按下。
  • onmouseenter : 当鼠标指针移动到元素上时触发。
  • onmouseleave : 当鼠标指针移出元素时触发
  • onmousemove : 鼠标被移动。
  • onmouseover : 鼠标移到某元素之上。
  • onmouseout : 鼠标从某元素移开。
  • onmouseup : 鼠标按键被松开。
  • onwheel : 该事件在鼠标滚轮在元素上下滚动时触发。

键盘相关

  • onkeydown : 某个键盘按键被按下。
  • onkeypress : 某个键盘按键被按下并松开。
  • onkeyup : 某个键盘按键被松开。

框架/图像相关

  • onabort : 图像的加载被中断。
  • onbeforeunload : 该事件在即将离开页面(刷新或关闭)时触发
  • onerror : 在加载文档或图像时发生错误。
  • onhashchange : 该事件在当前 URL 的锚部分发生修改时触发。
  • onload : 一张页面或一幅图像完成加载。
  • onpageshow : 该事件在用户访问页面时触发
  • onpagehide : 该事件在用户离开当前网页跳转到另外一个页面时触发
  • onresize : 窗口或框架被重新调整大小。
  • onscroll : 当文档被滚动时发生的事件。
  • onunload : 用户退出页面。
  • visibilitychange : document 监听事件,浏览器标签页被隐藏或显示的时触发
  • onmessage : 从 WebSocket 、 Web Worker 、 Event Source 、 iframe 或父窗口接收到消息时触发。
  • ononline : 该事件在浏览器开始在线工作时触发。
  • onoffline : 该事件在浏览器开始离线工作时触发。
  • onshow : 该事件当 <menu> 元素在上下文菜单显示时触发。
  • ontoggle : 该事件在用户打开或关闭 <details> 元素时触发。

表单事件相关

  • onblur : 元素失去焦点时触发。
  • onchange : 该事件在表单元素的内容改变时触发。
  • onfocus : 元素获取焦点时触发。
  • onfocusin : 元素即将获取焦点时触发。
  • onfocusout : 元素即将失去焦点时触发。
  • oninput : 元素获取用户输入时触发。
  • onreset : 表单重置时触发。
  • onsearch : 用户向搜索域输入文本时触发。
  • onselect : 用户在输入框内选取文本时触发。
  • onsubmit : 表单提交时触发。

剪贴板相关

  • oncopy : 该事件在用户拷贝元素内容时触发。
  • oncut : 该事件在用户剪切元素内容时触发。
  • onpaste : 该事件在用户粘贴元素内容时触发。

打印相关

  • onafterprint : 该事件在页面已经开始打印,或者打印窗口已经关闭时触发。
  • onbeforeprint : 该事件在页面即将开始打印时触发。

拖动相关

  • ondrag : 该事件在元素正在拖动时触发。
  • ondragend : 该事件在用户完成元素的拖动时触发。
  • ondragenter : 该事件在拖动的元素进入放置目标时触发。
  • ondragleave : 该事件在拖动元素离开放置目标时触发。
  • ondragover : 该事件在拖动元素在放置目标上时触发。
  • ondragstart : 该事件在用户开始拖动元素时触发。
  • ondrop : 该事件在拖动元素放置在目标区域时触发。

多媒体相关

  • onabort : 事件在视频/音频终止加载时触发。
  • oncanplay : 事件在用户可以开始播放视频/音频时触发。
  • oncanplaythrough : 事件在视频/音频可以正常播放且无需停顿和缓冲时触发。
  • ondurationchange : 事件在视频/音频的时长发生变化时触发。
  • onemptied : 当期播放列表为空时触发
  • onended : 事件在视频/音频播放结束时触发。
  • onerror : 事件在视频/音频数据加载期间发生错误时触发。
  • onloadeddata : 事件在浏览器加载视频/音当前帧时触发触发。
  • onloadedmetadata : 事件在指定视频/音频的元数据加载后触发。
  • onloadstart : 事件在浏览器开始寻找指定视频/音频触发。
  • onpause : 事件在视频/音频暂停时触发。
  • onplay : 事件在视频/音频开始播放时触发。
  • onplaying : 事件在视频/音频暂停或者在缓冲后准备重新开始播放时触发。
  • onprogress : 事件在浏览器下载指定的视频/音频时触发。
  • onratechange : 事件在视频/音频的播放速度发送改变时触发。
  • onseeked : 事件在用户重新定位视频/音频的播放位置后触发。
  • onseeking : 事件在用户开始重新定位视频/音频时触发。
  • onstalled : 事件在浏览器获取媒体数据,但媒体数据不可用时触发。
  • onsuspend : 事件在浏览器读取媒体数据中止时触发。
  • ontimeupdate : 事件在当前的播放位置发送改变时触发。
  • onvolumechange : 事件在音量发生改变时触发。
  • onwaiting : 事件在视频由于要播放下一帧而需要缓冲时触发。

动画相关

  • animationend : 该事件在 CSS 动画结束播放时触发
  • animationiteration : 该事件在 CSS 动画重复播放时触发
  • animationstart : 该事件在 CSS 动画开始播放时触发

过渡相关

  • atransitionend : 该事件在 CSS 完成过渡后触发。

参考

代码语言: javascript
复制
https://www.runoob.com/jsref/obj-window.html
https://www.runoob.com/jsref/dom-obj-event.html
https://www.w3cschool.cn/fetch_api/fetch_api-b5d62rev.html
本文参与 腾讯云自媒体同步曝光计划 ,分享自作者个人站点/博客。
原始发表:2020-04-20 , 如有侵权请联系 cloudcommunity@tencent.com 删除
jquery
css
网站

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划 ,欢迎热爱写作的你一起参与!

jquery
css
网站
评论
登录 后参与评论
0 条评论
热度
最新
登录 后参与评论
推荐阅读
目录
  • 浏览器事件
    • 浏览器事件
      • 加载相关
      • 窗口相关
      • 鼠标相关
      • 键盘相关
      • 动画相关
      • 设备相关
      • 打印相关
      • 应用相关
    • DOM事件
      • 鼠标相关
      • 键盘相关
      • 框架/图像相关
      • 表单事件相关
      • 剪贴板相关
      • 打印相关
      • 拖动相关
      • 多媒体相关
      • 动画相关
      • 过渡相关
    • 参考
领券
  • 社区

    • 技术文章
    • 技术问答
    • 技术沙龙
    • 技术视频
    • 学习中心
    • 技术百科
    • 技术专区
  • 活动

    • 自媒体同步曝光计划
    • 邀请作者入驻
    • 自荐上首页
    • 技术竞赛
  • 圈层

    • 腾讯云最具价值专家
    • 腾讯云架构师技术同盟
    • 腾讯云创作之星
    • 腾讯云TDP
  • 关于

    • 社区规范
    • 免责声明
    • 联系我们
    • 友情链接
    • MCP广场开源版权声明

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

  • 域名注册
  • 云服务器
  • 区块链服务
  • 消息队列
  • 网络加速
  • 云数据库
  • 域名解析
  • 云存储
  • 视频直播

热门推荐

  • 人脸识别
  • 腾讯会议
  • 企业云
  • CDN加速
  • 视频通话
  • 图像分析
  • MySQL 数据库
  • SSL 证书
  • 语音识别

更多推荐

  • 数据安全
  • 负载均衡
  • 短信
  • 文字识别
  • 云点播
  • 大数据
  • 小程序开发
  • 网站监控
  • 数据迁移

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

深圳市腾讯计算机系统有限公司 ICP备案/许可证号: 粤B2-20090059 粤公网安备44030502008569号

腾讯云计算(北京)有限责任公司 京ICP证150476号 | 京ICP备11018762号

问题归档 专栏文章 快讯文章归档 关键词归档 开发者手册归档 开发者手册 Section 归档

Copyright © 2013 - 2026 Tencent Cloud.

All Rights Reserved. 腾讯云 版权所有

登录 后参与评论
 
推荐文章
重情义的刺猬  ·  產生 OpenAPI 文件 | Microsoft Learn
3 周前
健壮的苦咖啡  ·  XMind如何快速插入超链接并设置样式?_编程语言-CSDN问答
2 周前
英姿勃勃的伤疤  ·  Qt事件系统深入解析事件分发传播过滤与自定义事件-开发者社区-阿里云
2 周前
痴情的啄木鸟  ·  如何禁用三星S24U系统自动更新?_编程语言-CSDN问答
2 周前
年轻有为的香烟  ·  浏览器事件开发者社区
1 周前
大鼻子的盒饭  ·  android gif转json动画_mob64ca12e63b18的技术博客_51CTO博客
10 月前
傻傻的荒野  ·  转载,(无法从传输中读取数据 ) - Hans.NET - 博客园
1 年前
爱运动的口罩  ·  公安部A级通缉令在逃人员投案自首:涉盗掘古墓葬_手机新浪网
2 年前
飘逸的领结  ·  Ingress 控制器 | Kubernetes
2 年前
豪情万千的围巾  ·  c# - XmlSerializer: The string '' is not a valid AllXsd value - Stack Overflow
2 年前
今天看啥   ·   Py中国   ·   codingpro   ·   小百科   ·   link之家   ·   卧龙AI搜索
删除内容请联系邮箱 2879853325@qq.com
Code - 代码工具平台
© 2024 ~ 沪ICP备11025650号