首页 > 解决方案 > 活动选项卡时刷新页面

问题描述

目前在我的页面中,我每分钟使用它来刷新页面:

<head>
...
<meta http-equiv="refresh" content="60" />
...
</head>

相反,我想在用户按下选项卡时刷新页面。假设用户在 Web 浏览器中打开了多个选项卡。他用了几分钟在另一个标签上冲浪。然后当他按下我网站的选项卡时,我希望页面自动刷新,因此用户不必自己检查页面上的任何更新。我怎样才能做到这一点?

标签: htmlmetapage-refresh

解决方案


你应该使用 js 和可见性 API:

在您的 html 页面中包含这个小脚本:

<script>
document.addEventListener("visibilitychange", function() {
   if (document.hidden){
       console.log("Browser tab is hidden")
   } else {
       console.log("Browser tab is visible")
       location.reload();
   }
});
</script>

改编自此处: 用户切换浏览器选项卡时的事件


推荐阅读