更新进度动画 gif 在回发时停止

Question

我使用了 ajax 更新进度控件，在回发发生时显示动画 gif。

问题：它显示一段时间，但随后停止引用（或者更确切地说，停止播放/旋转）。造成同样情况的实际原因是什么？

请指教！谢谢！

Answer 1

使用 Internet Explorer 时，.gif 的动画将在回发时停止。该问题是 Internet Explorer 固有的。显然这个问题可以追溯到 IE 6（尽管我只在 IE8 中确认过）。

围绕它有一个小技巧，那就是通过使用 setTimeout 更新它的源代码

function UpdateImg(ctrl) {
var img = document.getElementById(ctrl);
img.src = img.src;
}

setTimeout(function() { UpdateImg('image1'); }, 50);

。您还可以使用 jQuery 来制作图形动画。这在 IE 中有效，但现在我注意到 Chrome 无法在回发动画中一直工作。总有一些东西不存在？ ... :(

Answer 2

某些浏览器在处理 JavaScript 时会暂停当前显示元素的渲染。所以我总是注意到的行为是这样的：

• 页面开始回发并显示进度动画
• 服务器在动画运行时处理请求 服务器
• 将结果发送回浏览器
• 浏览器接收结果并开始处理它，同时暂停动画
• 当浏览器完成时，它会删除进度动画。这

取决于浏览器计算页面上实际更改所需的时间（在较旧的浏览器上需要更长的时间，尤其是 IE6、IE7 非常慢），这可能需要相当长的时间。此外，此阶段 JavaScript 中的错误也可能导致进度面板“永远”显示。