我在ios 5 pauses javascript when tab is not active主题中描述了同样的问题。
我的问题是,当我回到暂停的标签时,我是否会被注意到。
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上运行。
答案 0 :(得分:2)
两年前有人用this query提出了这个问题。不幸的是,它只得到了几个答案,其中一个似乎是实现这种效果的唯一方法。在Apple可以在移动版Safari中实现完整的Page Visibility API之前,我将继续使用我创建的自定义对象,该对象将使用API,如果不可用,则会回退到心跳代码。但是,据我所知,没有很好的方法来检查即将发生的制表符切换。
Here's a basic fiddle该对象展示了它唯一真实的方法。它本质上只接受焦点事件的处理函数,只要浏览器返回源选项卡就会触发焦点事件。回退最多只是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方法可以为其第二个参数接受一个params数组,然后它将传递给您的事件处理程序。这意味着您的事件处理程序将始终为其第一个参数设置一个事件对象(如果不支持API,则为null),并将您的参数数组作为其第二个参数。
也不是说这段代码已经过几个小时的测试,所以它可能容易出现故障。我会感激任何建设性的批评,使其生产有价值,直到Mobile Safari得到它的屁股。