jquery - 将两个 json 调用合二为一列表

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 每个都有超时

也可以通过使用来解决$.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>'