页面可见性改变事件:visibilitychange

页面可见性改变事件:visibilitychange1、PC浏览器上(以谷歌浏览器为例)刷新H5页面,会触发该事件,由于刷新导致该页面消失时,会检测到document.visibilityState===‘hidden’切换页面(包括切换离开和切换回来),导致页面暂时不处于激活状态时,会触发该事件。切换离开时document.visibilityState===‘hidden’,切换回该页面时,document.visibilityS…

大家好,又见面了,我是你们的朋友全栈君。

1、PC浏览器上(以谷歌浏览器为例)

  • 刷新H5页面,会触发该事件,由于刷新导致该页面消失时,会检测到document.visibilityState === ‘hidden’
  • 切换页面(包括切换离开和切换回来),导致页面暂时不处于激活状态时,会触发该事件。切换离开时document.visibilityState === ‘hidden’,切换回该页面时,document.visibilityState === ‘visible’
  • 关闭页面窗口时,会触发该事件。关闭窗口时,document.visibilityState === ‘hidden’
  • 关闭整个浏览器时,会触发该事件。关闭整个浏览器时,document.visibilityState === ‘hidden’

说明:当页面的document.visibilityState === ‘hidden’时,是可以发送请求的

2、安卓设备上(实验于手机的微信、UC浏览器软件中)

  • 刷新H5页面,会触发该事件,由于刷新导致该页面消失时,会检测到document.visibilityState === ‘hidden’
  • 点击页面上方的 x 按钮(或是其他关闭按钮),导致页面关闭时,会触发该事件。并在关闭时,document.visibilityState === ‘hidden’
  • 切换页面(包括切换离开和切换回来),导致页面暂时不处于激活状态时,会触发该事件。切换离开时document.visibilityState === ‘hidden’,切换回该页面时,document.visibilityState === ‘visible’
  • 将页面或页面所在程序软件切换到后台,或从后台切换到前台时,会触发该事件。切换到后台时,document.visibilityState === ‘hidden’;切换到前台时,document.visibilityState === ‘visible’
  • 手势滑动关闭页面或页面所在程序软件时,document.visibilityState === ‘hidden’

说明:当页面的document.visibilityState === ‘hidden’时,是可以发送请求的

3、IOS设备上(实验于手机的微信、UC浏览器软件中)

  • 刷新H5页面,会触发该事件,由于刷新导致该页面消失时,会检测到document.visibilityState === ‘hidden’
  • 点击页面上方的 x 按钮(或是其他关闭按钮),导致页面关闭时,会触发该事件。并在关闭时,document.visibilityState === ‘hidden’
  • 切换页面(包括切换离开和切换回来),导致页面暂时不处于激活状态时,会触发该事件。切换离开时document.visibilityState === ‘hidden’,切换回该页面时,document.visibilityState === ‘visible’
  • 将页面或页面所在程序软件切换到后台,或从后台切换到前台时,会触发该事件。切换到后台时,document.visibilityState === ‘hidden’;切换到前台时,document.visibilityState === ‘visible’
  • 手势滑动关闭页面或页面所在程序软件时,document.visibilityState === ‘hidden’

说明:当页面的document.visibilityState === ‘hidden’时,是不可以发送请求的,发送的请求会被销毁掉

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/150560.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 小程序文本内容无法长按复制粘贴_小程序读取剪贴板怎么办

    小程序文本内容无法长按复制粘贴_小程序读取剪贴板怎么办微信小程序的文本,要具有长按复制功能,必须满足两个条件:文本在<text>标签内;<text>标签要有selectable属性。例如:<textselectable=’true’>文本</text>下面一个例子是,解决WxParse不能长按选择的问题。在wxParse.wxml中修改:diff-…

    2022年9月29日
    2
  • phpstorm2021 4月永久激活码_通用破解码

    phpstorm2021 4月永久激活码_通用破解码,https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月16日
    458
  • 百度UEditor基本使用

    百度UEditor基本使用

    2021年9月18日
    130
  • Fragment 点击返回键 做返回操作

    Fragment 点击返回键 做返回操作

    2021年3月12日
    180
  • Cloudsim学习笔记——基本知识

    Cloudsim学习笔记——基本知识Cloudsim澳大利亚墨尔本学校的网格实验室和Gridbus项目推出,是在离散事件模拟包SimJava上开发的函数库,继承了GridSim的编程模型,特点:支持大型云计算的基础设施的建模和仿真; 一个自足的支持数据中心、服务代理人、调度和分配策略的平台独特功能:提供虚拟化引擎,旨在数据中心节点上帮助建立和管理多重的、独立的、协调的虚拟化服务; 在对虚拟化服务分配处理核心时能够在时…

    2022年10月13日
    3
  • vue如何引用js文件_html转化为vue组件

    vue如何引用js文件_html转化为vue组件VUE项目中引入JS文件的几种方法在开发Vue项目的时候,有时需要使用一些非ES6格式的没有export的js库,可以有如下方法实现:1.在index.html页面使用script标签引入当然也可以使用cdn的地址。这样引入后的内容是全局的,可以在所有地方使用。Map2.在main.js中使用window.moduleName使用也可以放入Vue.prototype中,这样组件内都可以使用。va…

    2022年10月8日
    0

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号