Question

我有以下代码：

JSON调用1

$.get(url1, function(json){

  var list = '<ul>'

  $.each(json.data, function(index, value){
    list += '<li>'+value+'</li>'
  });

  list += '</ul>'

});

JSON调用2

$.get(url2, function(json){

  var list = '<ul>'

  $.each(json.data, function(index, value){
    list += '<li>'+value+'</li>'
  });

  list += '</ul>'

});

此代码生成两个单独的无序列表。

这可以灵活组合，以便我可以合并这两个列表，但没有嵌套的JSON调用吗？

Answer 1

您使用$.when将两个承诺转换为一个：

$.when($.get(url1), $.get(url2)).done(function (res1, res2) {
  var list = '<ul>';

  var both = res1.data.concat(res2.data);
  $.each(both, function(index, value){
    list += '<li>'+value+'</li>';
  });

  list += '</ul>';

  // do something with list

})

$.when对于为异步ajax调用提供顺序非常有用，同时仍能保持并行请求的效率。你的另一个问题：

jQuery each with timeout

也可以使用$.when解决。

Answer 2

如果没有嵌套的AJAX调用，我不知道如何做到这一点。这应该有效：

var list = '<ul>';

function appendItems(json) {
    $.each(json.data, function(index, value) {
        list += '<li>' + value + '</li>';
    });
}

$.get(url1, function(json) {
    appendItems(json);
    $.get(url2, function(json) {
        appendItems(json);
        list += '</ul>';
        // list is complete
    });
});

Answer 3

也许这会有所帮助：

var list = '<ul>'
for(var i=1;i<=2;i++){    
     $.get('http://www.example.com/page'+i, function(json){

      $.each(json.data, function(index, value){
        list += '<li>'+value+'</li>'
      }); 

    });
}
list += '</ul>'

在一个<ul>列表</ul>上组合两个json调用

3 个答案: