javascript - $(window).blur() 在智能手机浏览器中无法正常工作？

Question

我创建了一个 - online quiz web application 。

开始测验后，我希望页面在用户更改选项卡或最小化应用程序时自动刷新。

为此我使用了 $(window).blur(function(){window.location.reload();});

它在笔记本电脑上运行良好，但在手机(android/ios)上运行不佳，尤其是当我在中间接到电话或按下主页按钮最小化浏览器时。

有办法吗？请帮忙。

Answer 1

您可以使用 HTML5 Visibility API 来检测页面可见性何时发生变化:https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API

以上网址的修改示例:

function handleVisibilityChange() {
  if (document.hidden) {
    // restart your quiz
  } 
}

document.addEventListener("visibilitychange", handleVisibilityChange, false);