pagehide和pageshow事件在ios chrome上无法正常工作

时间:2014-01-23 14:49:08

标签: javascript ios google-chrome javascript-events

Apple文档列出了可用的iOS浏览器事件: https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html

'pagehide'和'pageshow'事件似乎在safari上运行正常,但在chrome上它只适用于页面加载和卸载。它不起作用:

1)按主页按钮,即将chrome发送到背景

2)切换标签

以下是一个可用于验证它的小型JavaScript代码段:

<script type="text/javascript">
        window.addEventListener("pageshow", function(evt){
            alert('show');
        }, false);
        window.addEventListener("pagehide", function(evt){
            alert('hide');
        }, false);
</script>

我可以做些什么来检测铬是否已发送到背景。我需要在chrome返回前台后立即清除setTimeout计时器。任何解决方法?

2 个答案:

答案 0 :(得分:6)

以下是工作代码:

<script type="text/javascript">
        var heartbeat;
        var lastInterval;

        function clearTimers() {
            clearTimeout(heartbeat);
        }

        function getTime() {
            return (new Date()).getTime();
        }

        function intervalHeartbeat() {
            var now = getTime();
            var diff = now - lastInterval - 200;
            lastInterval = now;
            if(diff > 1000) { // don't trigger on small stutters less than 1000ms
                clearTimers();
            }
        }
        lastInterval = getTime();
        heartbeat = setInterval(intervalHeartbeat, 200);

您可以在此处找到更多详细信息:http://aawaara.com/post/74543339755/smallest-piece-of-code-thats-going-to-change-the-world

答案 1 :(得分:2)

Pagehide和pageshow不是您要完成的任务所需的事件。

相反,请将visibilitychange事件与document.hiddendocument.visibilitystate结合使用,这应该完全符合您的要求。

此功能仅适用于支持的浏览器 - 迄今为止包括Chrome,但尚未安装Safari(尚未推出)。为了安全起见,我会在clearTimers()上致电visibilitychange,只有在未定义document.visibilitystate的情况下,才会回到pagehide上调用它。

请参阅:

MDN: visibilitychange event

MDN: Using the Page Visibility API

Page Visibility - W3C recommendation, October 2013