Question

我正在创建一个java servlet页面，它检查域名列表，并通过jquery ajax请求检查每个域名。它工作正常，除了结果不按顺序附加到DOM。在请求的顺序中处理请求的最佳方法是什么，但也像长轮询效果一样异步。我是javascript的新手。

这是我用于请求的代码：

$.ajax({
    async:true,
    type:'GET',
    url:servlet,
    success:function(data){
        $('p').append(data+"<br>");
    }, 
});

我正在考虑向java servlet发送一个序列号，它将通过JSON返回它，但我想知道是否有更简单的方法。

Answer 1

我要做的是提前为响应创建容器，然后绑定它周围的回调（实际上不像bind（）函数那样绑定）。

例如，假设您有一个类似<div id="container"></div>的容器，您可以执行以下操作：

function makeRequest(something) {
    var target = $("<div></div>");
    $("#container").append(target);
    $.get("", {something: something}, function(data) {
        target.html(data);
    });
}

就灵活性而言，这是一个相当糟糕的例子，但它应该说明这一点。它在发出请求之前向容器添加div，然后使用该div将响应推送到。这意味着div将按请求的顺序附加。您可以扩展这个想法，使用样式使其看起来像div在填充之前不存在，或者您可以在其中添加“正在加载”消息。

（另外，something参数的数据传递相当糟糕，但希望你明白这一点。）

Answer 2

我猜你的问题是浏览器会向服务器发送尽可能多的AJAX请求，服务器会尽可能地回答它们。服务器可能只是比其他服务器更快地回答，所以尽管请求是按顺序发送的，但是它们会使它们无序。

解决此问题的方法是按顺序发送查询以确保回复顺序。基本上，做一个AJAX调用，并且在该调用成功后，然后启动第二个AJAX调用，等等......

Answer 3

您可以对发送到服务器的请求进行排序，缓存结果，并仅按顺序添加它们

next_to_request = 0;
next_to_append = 0;
results = [];
function reqToServer(){
  var e = next_to_request++;

  $.ajax({
    async:true,
    type:'GET',
    url:servlet,
    success:function(data){
        results[e] = data;
    }, 
  }); 
function loadAnswers(){
   if (results[next_to_request]){
     data = results[next_to_request];
     next_to_request++;
     $('p').append(data+"<br>");
   }
}

setTimeout(100, loadAnswers);

这有一个不同的线程用于显示结果，并且只以正确的顺序显示。

Answer 4

从Ajax函数本身获取成功函数，并链接成功函数，它们将按顺序触发，如果一个请求尚未完成，它将等待它完成，然后再触发下一个。

一个非常简单的方法就是这样做：

var firstOne = $.ajax({
    async:true,
    type:'GET',
    url:servlet
}); 

var SecondOne = $.ajax({
    async:true,
    type:'GET',
    url:servlet
}); 

firstOne.done(function(data){
    $('p').append(data+"<br>");
    SecondOne.done(function(data){
        $('p').append(data+"<br>");
    }); 
});

有关更高级的方法，了解promises如何工作是一个好主意！

这比顺序发送ajax请求要快得多，等待最后一个请求在下一个请求开始之前完成，因为这将在浏览器可用时发送所有这些请求，并且链接done（）函数将等待任何尚未完成的，只需执行按照您放入的顺序到达时立即完成的内容，然后按正确的顺序添加内容。如果使用promises和$ .when / $进行许多ajax调用，那么将允许您使用迭代等构建更合理的函数。

如何按请求的顺序处理jquery ajax请求

4 个答案: