如何检查此页面是否在 php 中打开的选项卡上的活动页面中

Question

在 instagram 中，当您打开并查看某人的故事时，它会超时，直到转到下一个故事，但是当您更改浏览器选项卡时，它会停止，而当您返回时，它会从您离开页面的位置返回。对不起我的英语不好我希望你已经明白了。

那么我如何在 php 中做到这一点，我想在用户离开选项卡时停止倒计时。

Answer 1

您可以使用以下函数获取用户何时离开

$(window).blur(function(e) {
    // What to do when user leaves
});

然后这个other在用户returns

时得到

$(window).focus(function(e) {
    // What to do when user comes back
});

在 ready 上使用它，因为它会自动触发 focus 函数，如果 DOM 尚未加载，它会抛出错误。还记得做好准备，不要在第一次专注时做任何事情，除非这不是问题。

Answer 2

这里是an example how to keep your animations in sync when browser tab is changed.

当当前浏览器选项卡 in/active 使用 HTML 5 可见性 API 时，您可以使用相同的方法 pause/resume 您的故事超时，如下所示：

var vis = (function(){
var stateKey, 
    eventKey, 
    keys = {
            hidden: "visibilitychange",
            webkitHidden: "webkitvisibilitychange",
            mozHidden: "mozvisibilitychange",
            msHidden: "msvisibilitychange"
};
for (stateKey in keys) {
    if (stateKey in document) {
        eventKey = keys[stateKey];
        break;
    }
}
return function(c) {
    if (c) document.addEventListener(eventKey, c);
    return !document[stateKey];
}})();

Codepen 上的实时预览：https://codepen.io/jonathan/pen/sxgJl

如何检查此页面是否在 php 中打开的选项卡上的活动页面中

How to check if this page in active page on opened tabs in php

php

jquery

instagram