js如何监听页面的展示与隐藏(visibilitychange) 以及苹果部分机型 safari浏览器无法监听到(visibilitychange)的处理办(pageshow)。

一、场景：当标签页面隐藏、然后展示的时候触发事件

涉及到两个网页的跳转 而产生的问题

二、安卓和ios需要分别来处理兼容问题

安卓 中可以直接使用 visibilitychange 来判断标签页展示、还是隐藏

document.addEventListener("visibilitychange", () => { 
  if(document.hidden) {} // 页面被挂起
  else {  // 页面呼出
  	// 增加路由判断 仅当前页面生效
    // if(window.location.pathname === "/activityMidPage"){
    //  // ...
    // }
  }
});

visibilitychange MDN官方文档

ios 中无法触发 visibilitychange 事件，所以需要 pageshow 来做一个兼容

const isIos = /ipad|iPhone|Mac/i.test(window.navigator.userAgent) 
if(isIos) {
  window.addEventListener('pageshow', function(event) {
    // // 增加路由判断 仅当前页面生效
    // if(window.location.pathname === "/activityMidPage"){
    //  // ...
    // }
  }) 
}

pageshow MDN官方文档 https://developer.mozilla.org/zh-CN/docs/Web/API/Window/pageshow_event