javascript 如果其中包含 setTimeout,则不会调用 iOS 6 js 事件函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12855123/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
iOS 6 js events function not called if has setTimeout in it
提问by kiwi1342
I noticed this strange behaviour with the latest iOS (iOS 6). If calling a function for any touch event which has a setTimeout inside, the part inside the setTimeout is never triggered.
我在最新的 iOS (iOS 6) 中注意到了这种奇怪的行为。如果为任何带有 setTimeout 的触摸事件调用函数,则永远不会触发 setTimeout 内的部分。
This happens only when there is a "system animation" such as scroll and zoom-in/out.
仅当存在滚动和放大/缩小等“系统动画”时才会发生这种情况。
For example:
例如:
(I used jquery just for testing but the same happens with pure js)
(我使用 jquery 只是为了测试,但纯 js 也会发生同样的情况)
Open that page with safari on any iOS 6 device and zoom in or out. The alert will never be called.
在任何 iOS 6 设备上使用 safari 打开该页面并放大或缩小。永远不会调用警报。
If tested on any iOS 5 device this will work just fine! It seems that during these animations the setTimeout or setInterval are reset by the OS. Is this the intended behaviour or a bug?
如果在任何 iOS 5 设备上测试,这将工作得很好!似乎在这些动画期间 setTimeout 或 setInterval 被操作系统重置。这是预期的行为还是错误?
Thanks
谢谢
回答by Hyman
Note: It looks like UIWebView does not support requestAnimationFrames. Thanks to Guillaume Gendrefor pointing it out!
注意:看起来 UIWebView 不支持 requestAnimationFrames。感谢Guillaume Gendre指出这一点!
We ran into a similar issue with a web app we're working on.
我们正在开发的网络应用程序中遇到了类似的问题。
For us, it was touchmove that caused issues. We implemented a workaround (found here: https://gist.github.com/3755461) that seemed to work pretty well until another issue forced us to abandon it. (I tried adding the workaround to your fiddle and was able to get the timer to fire once or twice, but it required a weird gesture+scroll event that was damn near impossible to consistently reproduce.)
对我们来说,是 touchmove 引起了问题。我们实施了一种解决方法(可在此处找到:https: //gist.github.com/3755461),它似乎工作得很好,直到另一个问题迫使我们放弃它。(我尝试将解决方法添加到您的小提琴中,并且能够让计时器触发一两次,但它需要一个奇怪的手势 + 滚动事件,该事件几乎不可能始终如一地重现。)
Anyway, one of the new features in iOS 6 for developers are requestAnimationFrames. My workaround is basically a wrapper for timers, allowing the developer to pass a boolean, which will call either the native function or the workaround function.
无论如何,iOS 6 中面向开发人员的新功能之一是 requestAnimationFrames。我的解决方法基本上是计时器的包装器,允许开发人员传递一个布尔值,它将调用本机函数或解决方法函数。
For example:
例如:
setTimeout(function(){alert("HI")}, 1000); // using native
setTimeout(function(){alert("HI")}, 1000, true); // using workaround
Here are additional ways to use the 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);
Here are two fiddles with the workaround examples. Try pinch/zooming on the black squares:
这是解决方法示例的两个小提琴。尝试捏/缩放黑色方块:
http://jsfiddle.net/xKh5m/embedded/result(Uses native setTimeout
function)
http://jsfiddle.net/ujxE3/embedded/result
http://jsfiddle.net/xKh5m/embedded/result(使用原生setTimeout
函数)
http://jsfiddle.net/ujxE3/embedded/result
We've been using this workaround for a few months in a production environment, and have not run into any major issues.
我们已经在生产环境中使用此解决方法几个月了,并且没有遇到任何重大问题。
Here's a public gist of the workaround: https://gist.github.com/4180482
这是解决方法的公开要点:https: //gist.github.com/4180482
Here's more information about requestAnimationFrames:
以下是有关 requestAnimationFrames 的更多信息:
Paul Irish on requestAnimationFrame
Paul Irish on requestAnimationFrame
Good luck!
祝你好运!