页面可见性改变事件:visibilitychange

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’时,是不可以发送请求的,发送的请求会被销毁掉

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章