jQuery按顺序呈现从Ajax请求获取的项目

我有一个页面显示对象列表。这些列表中的每一个都来自ajax调用。我该如何确保它们按顺序呈现？jQuery按顺序呈现从Ajax请求获取的项目

我试过使用here显示的技术，但是如果其中一个请求失败，它会拒绝剩下的。我的数据不依赖于前面的内容，那么如何修改示例并处理错误？

2012-04-06 zsquare

要知道，在另一个post，我写了这个小解析器类，但我喜欢这个主意管道。我不知道我非常喜欢这个例子，但是稍微调整一下，我认为它会工作得很好。我承认，尽管如此，我还没有对此进行测试。

var urls = ["path1","path2","path3"]; // Output from string.split() 
var chain = $.Deferred(); // Create the root of the chain. 
var promise = chain; // Placeholder for the promise 

// Build the chain 
jQuery.each(urls,function(index,elem){ 
    // Pipe the response to the "next" function 
    promise = promise.pipe(function(response) 
    { 
     var myurl = elem; // Get the current part 
     var newPromise = $.Deferred(); 
     $.ajax 
     ({ 
      type: "GET", 
      url: myurl 
     }).done(function(data){ 
      //these are your normal ajax success function params, IIRC 
      //do stuff with response 
     }).fail(function(){ 
      //oops, it failed, oh well 
      //do stuff on failure 
     }).always(function() { 
      //but always resolve the sequencing promise 
      newPromise.resolve();    
     }); 
     return newPromise; 
    }) 
}); 

chain.resolve();

编辑：这是一个用的jsfiddle模拟Ajax请求http://jsfiddle.net/jfcox/gFLhK/。正如你所看到的，它全部顺序排列。编辑二：在评论中稍作调整。请注意，您应该可以通过向您的下一个承诺传递信息给您的下一个承诺...

编辑III：修改每戴夫的建议。为了进一步分离问题，您可以在ajax请求上使用always。

来源

2012-04-06 14:45:00 JayC

也许对newPromise.resolve（）使用.always（）？（我真的需要更多地解决这个问题。） – Dave 2012-04-06 15:25:47

解决问题的关键是解决承诺链中的当前承诺（您将永远需要解决ajax/ajax承诺是否成功（已解决）或失败（被拒绝），但你确实提出了一个好的观点，而不是在完成/失败代码后要求解决承诺，你可以把它放在它自己的“always”调用中，并进一步分离出这个问题。 – JayC 2012-04-06 15:37:41

如果你的意思是和always一起链接，比如用'always'替换'pipe'调用......好吧，我认为问题总是返回原始的promise，而pipe总是返回一个新的。但我的意思是错误的 – JayC 2012-04-06 15:40:18

您可以保存响应列表中的数组

function response() { 
    responseArray[i] = response; // Where i is the sequence number of request and response; 
    responseHandler(); // Ping some function which can take the response in the order and process it. 
}

来源

2012-04-06 12:23:30

我还没有完全理解你的回复，所以请纠正我，如果我错了，但在这种情况下，我不必等待所有的请求之前完成渲染？ – zsquare 2012-04-06 13:12:55

没有您收到响应，responseHandler（）函数将被调用，该函数将解析数据。 – 2012-04-06 13:16:48

我不认为这回答OP的问题。 Ajax响应可能不符合其请求的顺序。 – JayC 2012-04-06 14:20:30

您是否尝试过使用jQuery.when？
http://api.jquery.com/jQuery.when/

例
http://jsfiddle.net/94PGy/4/

在其中Deferreds之一被拒绝多重Deferreds情况下，jQuery.when立即触发其主延迟的failCallbacks。请注意，在这一点上，某些延期付款可能仍未解决。如果您需要为这种情况执行额外的处理，例如取消任何未完成的ajax请求，则可以将引用保留在关闭中的基础jqXHR对象中，并在failCallback中检查/取消它们。

来源

2012-04-06 15:23:11

jQuery按顺序呈现从Ajax请求获取的项目

回答

相关问题