javascript - JQuery 加载 gif 在繁重的 dom 操作期间卡住

标签 javascript jquery loading gif

<分区>

Possible Duplicate:
How to make GIF rotate when the tree is loading in Javascript

正如标题所说，我的加载 gif 在通过 ajax 成功调用时卡住。成功调用需要执行一些繁重的 DOM 操作，并且由于 UI 是单线程的，它会导致我的加载 gif 卡住。

到目前为止我已经尝试过

优化我的功能，但是有太多的数据需要同时加载。
使用 setTimeout()，但它会在加载所有内容后显示所有 gif。
使用spin.js ，但在 DOM 操作期间它也会卡住。

有什么办法可以解决这个问题吗？

非常感谢任何帮助。

编辑 1:
与ArcGIS有关javascript，我必须从数据库中检索大约 4000 行，然后通过遍历所有点的 for 循环在正确的纬度和经度处显示点。
我正在尝试做一个简单的概述，如 this one ^?。

最佳答案

您必须模拟多线程，以便在处理 AJAX 响应时让 UI 保持响应。

其中唯一重要的部分是安排处理功能，使其任务可以拆分并按步骤执行。

当您获得调用的数据时:

function ProcessData() {
    var done = false;        

    /*
        access the data here and perform a "bit" of data processing.

        if the task finishes set done to true
    */

    if(!done) {
        setTimeout(ProcessData, 100); // this gives the UI 0,1 secs
    }
}

当然上面的函数必须有一些方法来访问数据(使用全局或者更好的是，正确设置它的上下文)，注册操作的进度等等。

只是提供一个思路，网上有很多解释的很详细。

或者您可以获得“JavaScript 忍者的 secret ”的副本并阅读“驯服线程和计时器”一章。

希望这对您有所帮助。

关于javascript - JQuery 加载 gif 在繁重的 dom 操作期间卡住，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14198397/