javascript - 如果其中有 setTimeout，则不会调用 iOS 6 js 事件函数

Question

我注意到最新的 iOS (iOS 6) 有这种奇怪的行为。如果为任何内部有 setTimeout 的触摸事件调用函数，则永远不会触发 setTimeout 内的部分。

只有在有滚动和放大/缩小等“系统动画”时才会发生这种情况。

例如:

http://jsfiddle.net/p4SdL/2/

(我使用 jquery 只是为了测试，但纯 js 也是如此)

在任何 iOS 6 设备上使用 safari 打开该页面并放大或缩小。警报永远不会被调用。

如果在任何 iOS 5 设备上进行测试，它将正常工作!似乎在这些动画期间，操作系统重置了 setTimeout 或 setInterval。这是预期的行为还是错误？

谢谢

Answer 1

注意:UIWebView好像不支持requestAnimationFrames。感谢Guillaume Gendre感谢指出!

我们在开发的网络应用程序中遇到了类似的问题。

对我们来说，是触摸移动导致了问题。我们实现了一个解决方法(可在此处找到:https://gist.github.com/3755461)，在另一个问题迫使我们放弃它之前，它似乎工作得很好。 (我尝试将解决方法添加到您的 fiddle 中，并且能够让计时器触发一次或两次，但它需要一个奇怪的手势 + 滚动事件，这该死的几乎不可能始终如一地重现。)

无论如何，iOS 6 中为开发人员提供的新功能之一是 requestAnimationFrames。我的解决方法基本上是计时器的包装器，允许开发人员传递一个 bool 值，它将调用 native 函数或解决方法函数。

例如:

setTimeout(function(){alert("HI")}, 1000); // using native
setTimeout(function(){alert("HI")}, 1000, true); // using workaround

以下是使用解决方法的其他方法:

setInterval(function(){console.log("Interval")}, 1000, true);

var timer = setTimeout(function(){ /* ... */ }, 60000, true);
clearTimeout(timer);

var interval = setInterval(someFunc, 10000, true);
if(someCondition) clearInterval(interval);

这里有两个带有解决方法示例的 fiddle 。尝试捏合/缩放黑色方 block :

http://jsfiddle.net/xKh5m/embedded/result (使用原生 setTimeout 函数) http://jsfiddle.net/ujxE3/embedded/result

我们已经在生产环境中使用此变通办法几个月了，没有遇到任何重大问题。

这是解决方法的公开要点:https://gist.github.com/4180482

这里是关于 requestAnimationFrames 的更多信息:

MDN documentation

Paul Irish on requestAnimationFrame

祝你好运!