2

I've the same problem depicted in iOS 5 pauses JavaScript when tab is not active thread.

我的问题是,当我回到暂停的标签时,是否会被注意到。

onfocus并且onblur事件不适用于要暂停的选项卡。

编码:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
<script src="http://code.jquery.com/jquery-1.7.1.min.js" ></script>
<script type="text/javascript">
window.onblur = function () {
    console.log("blur");
    $("#whatevent").append("blur<br/>");
}
window.onfocus = function () {
    console.log("focus");
    $("#whatevent").append("focus<br/>");
 }
 window.onunload = function () {
       console.log("unload");
       $("#whatevent").append("unload<br/>");
 }
 window.onload = function () {
      console.log("load");
      $("#whatevent").append("load<br/>");
  }

</script>
</head>

<body>
    <div id="whatevent"></div>
</body>
</html>

没有但onload(但仅在我第一次加载页面时)事件在我切换选项卡时在 iPad 上有效。

4

1 回答 1

2

两年前有人用这个查询提出了这个问题。不幸的是,只有几个答案,其中一个似乎是实现此效果的唯一方法。在 Apple 可以在移动 safari 中实现完整的 Page Visibility API 之前,我只能使用我创建的这个自定义对象,它将使用 API 并在它不可用时回退到心跳代码。但是,据我所知,没有很好的方法来检查即将发生的选项卡切换。

这是该对象的基本小提琴,展示了其唯一真正的方法。它本质上只是接受一个焦点事件的处理函数,只要浏览器返回源选项卡就会触发该事件。回退充其量是hacky,并且不仅会在重新进入页面时触发,而且会在脚本停止的时间超过计时器阈值时触发;这可能是在键盘可见、滚动时或正在运行的脚本阻止 requestAnimationFrame 触发时。由于滚动是最常见的行为,我添加了一个处理程序来重置上次保存的时间,以便避免触发焦点事件。

这是包含上述“hacky”方法的脚本的主要部分:

    _that.onFocus = function(handler, params) {
        var hiddenProp = getHiddenProp();

        console.log("Hidden prop: " + hiddenProp);

        if (hiddenProp) {
            var evtName = hiddenProp.replace(/[H|h]idden/, "") + "visibilitychange";
            document.addEventListener(evtName, function(e) {
                if (isHidden()) {
                    handler(e, params);
                }
            }, false);
        }else {
            var handlerObj = {"handler": handler};
            if (params !== undefined) {handlerObj.params = params}
            _handlers.push(handlerObj);
            startLoop();
        }

    };

其余的可以在小提琴中阅读。为了查看回退,您必须使用平板电脑(如果没有平板电脑,您为什么需要此功能?)。

请注意,.onFocus 方法可能接受其第二个参数的参数数组,然后它将传递给您的事件处理程序。这意味着您的事件处理程序的第一个参数将始终具有一个事件对象(如果 API 不受支持,则为 null),并且您的参数数组作为其第二个参数。

也不是说这段代码已经测试了几个小时,所以它可能容易出现故障。我将不胜感激任何建设性的批评,以使其值得生产,直到 Mobile Safari 开始发挥作用。

于 2013-02-01T23:30:57.833 回答