jquery - 当用户在浏览器中更改选项卡时，Javascript 中是否会触发一个事件

Question

让我从问题开始:Chrome 在使用 setTimeout() 时表现奇怪，如果用户更改浏览器选项卡，则 Javascript 的执行将停止/暂停。用户改回来后，Chrome 想要 catch ，因此动画不遵守时间限制，并且动画失去控制。

如果用户在一段时间后回来，我正在尝试阻止 Chrome 加速动画。我在另一个问题中发现 jQuery 提供了 .blur 和 .focus 事件，但这似乎也不起作用:

$(window).blur(function() {
  clearTimeout(timer) 
})

是否有任何方法可以在用户更改选项卡的那一刻停止动画，或者在用户更改选项卡后是否没有触发任何事件？

Answer 1

在大多数现代浏览器中，当选项卡未处于焦点时，超时会经常停止触发，这就是您看到动画暂停/抖动的原因。这是故意的。

有一个great mozilla article这解释了如何编写一些逻辑来在选项卡未获得焦点时处理动画。它甚至包括一个名为 animLoop.js 的小型跨浏览器库。来帮你。这些示例也适用于 Chrome。