关于jquery：使用javascript批量加载数组


Batch loading an array with javascript

本问题已经有最佳答案，请猛点这里访问。

Possible Duplicate:
Wait until all jquery ajax request are done?

我有一个N尺寸的数组。 数组的每个元素都需要使用jquery通过ajax加载。 我有加载逻辑完成，我现在只是想弄清楚如何加载10(公式应该能够处理更改此值)，当10项完成通过ajax加载，加载下一个10.这里 是我的榜样。

我有一个数组的100个元素，需要加载前0-9个项目，当这10个项目完成时，10-19，然后是20-29等等。我试图让它尽可能高效，谢谢 任何帮助。

虽然这可能完全没有，但我希望我能得到我的观点以获得任何帮助。

1
2
3
4
5
6
7
8
9
10
11
12
13
//Formula calculation
while(wait till count is complete){

}
function LoadBatch(array){
$.each(array,function(i,item){
$.ajax({
success:function(){
//Maybe a counter here to let loop know when to kick off next batch.
}
});
});
}
相关讨论

使用控制流程库将使您的生活更轻松。 Aysnc.queue()看起来合适。 它将确保一次激活不超过10个请求。 在开始下一次加载之前，它不会等待前10次完成。 这应该最小化加载时间，同时限制并发请求。

这是一个例子：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
var results = [];
var concurrency = 10;

var q = async.queue(function (task, done) {
  var item = task.item;
  $.ajax({
    success: function(result) {
      // Store results in array with indicies matching the original array.
      // If you don't care about the order of the results you could just
      // push them on.
      results[task.index] = result;
      done();
  });
}, concurrency);

// push all the array items into the queue, keeping track of the index
$.each(array, function(i, item) {
  q.push({
    index: i,
    item: item
  });
});

// drain will be called when all the requests are done
q.drain = function() {
  console.log(results); // results has all the responses
}
相关讨论

做一些如下事情：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function loadArray(array, batchSize, callback) {
    var length = array.length
    batchSize = length < batchSize ? length : batchSize; // minimum
    var batch = array.slice(0, batchSize); // the current batch
    array = array.slice(batchSize); // the rest of the array

    loadBatch(batch, function (results) {
        if (array.length) { // there are more batches to process
            // load the rest of the array
            loadArray(array, batchSize, function (nextResults) {
                // merge the results - recursion handles the rest
                callback(results.concat(nextResults));
            });
        } else callback(results); // last batch
    });
}

loadBatch功能如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function loadBatch(batch, callback) {
    var completed = 0;
    var length = batch.length;
    var results = new Array(length); // the array of results

    $.each(array, function (index, element) {
        $.ajax(element, {
            complete: function (xhr, status) {
                // save the results
                results[index] = {
                    xhr: xhr,
                    status: status
                };

                if (++completed === length) callback(results); // done
            }
        });
    });
}

现在您可以按如下方式加载资源：

1
2
3
4
5
loadArray(["a.json","b.txt", ...], 10, function (results) {
    var a = JSON.parse(results[0]);
    var b = results[1];
    // and so on
});

而已。 如果您有任何问题，请告诉我。