javascript - 使用 jQuery 进行 Ajax 分页

Question

我需要从一个对返回结果数量有限制的 API 中检索数据。

使用找到的结果总数，我可以进行额外的 ajax 调用，直到检索到所有数据。但是，在页面上显示之前，我需要按字母顺序对所有数据进行排序。

在成功进行所有 ajax 调用后，如何访问数组中的数据？

这是我目前所拥有的:

var mydata = [];

function loadPosts() {

  var api = 'http://someurl.com';

  $.ajax({
    url: api,
    dataType: 'jsonp',
    data: {
      rows: 1,
    },
    success: function(data) {
      totalNumberOfRecords = data.numFound;

      for (var start = 0; start < totalNumberOfRecords; start += rows) {
        $.ajax({
          url: api,
          dataType: 'jsonp',
          data: {
            'rows': rows,
            'start': start,
          },
          success: function(data) {
            $.each(data.namesList, function(index, item) {
              mydata.push(item.firstName);
            });
          },
        });
      }
    },
  });
}

console.log(mydata);

Answer 1

这是一种方便面解决方案。

var numOfAjax = 0;
var numOfResolvedAjax = 0;
for (var start = 0; start < totalNumberOfRecords; start += rows) {
    numOfAjax++;
    $.ajax({
        url: api,
        dataType: 'jsonp',
        data: {
            'rows': rows,
            'start': start,
        },
        success: function(data) {
            $.each(data.namesList, function(index, item) {
                mydata.push(item.firstName);
            });
            numOfResolvedAjax++;

            // Check if all ajax request has been responded to sort the result.
            if (numOfResolvedAjax === numOfAjax) {
                sortMyData(myData);
            }
        },
    });
}

完美解决方案请进async具有许多功能的库可以为您提供帮助。例如:async.parallel可能是您需要的。