前端 --- 检测当前页面(窗口)的可见性状态

作者：笔触狂放9 | 2024-06-01 20:52:04

踩

visibilitychange 事件是一个在浏览器中的 Document 对象上触发的事件，用于检测当前页面的可见性状态是否发生变化。

当用户切换到其他标签页、最小化浏览器窗口、或者将浏览器窗口隐藏在其他窗口后面时，页面的可见性会发生变化，此时就会触发visibilitychange事件。

使用如下：


document.addEventListener('visibilitychange', function() {
  if (document.visibilityState === 'visible') {
    // 页面变为可见状态时执行的操作
  } else if (document.visibilityState === 'hidden') {
    // 页面变为不可见状态时执行的操作
  }
});

注意：visibilitychange 事件的行为在不同的浏览器中可能有所不同，因此在使用时需要注意浏览器兼容性。此外，一些移动设备或电脑的节能模式也可能会影响页面的可见性状态，进而触发这个事件。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/笔触狂放9/article/detail/659361