Question

我有一个要求，我需要使用Ajax请求和循环获取大约50-100个URL。这是有效的，但Firefox没有响应并冻结。有没有办法可以实现＆＃34;当第一个完成时，转到下一个网址＆＃34;。喜欢什么时候 - 然后在jquery或类似的东西。

data = [url1, url2, url3, url4, url5, url6, ............]
for(i=0; i < 50; i++){
  $.ajax({
     async: false,
     type: 'GET',
     url: data[i],
     dataType: 'json',
     success: function(data){   
        alert(data);
     }
  });
}

我还想看看我们是否可以推送至少2个网址以加快速度。

更新：

检查了下面给出的所有解决方案，但没有任何效果。现在我更加兴奋，并寻找一个可以运行＆＃39; n＆＃39;没有任何崩溃或无响应的AJAX调用数

Answer 1

如果你必须这样做，你可以使用jQuery deferred's链接你的AJAX调用：http://api.jquery.com/deferred.then/。还可以使用助手fn简化操作：

var urls = [url1, url2, ....];
function callAjax(url) {
  return function() {
    return $.ajax({url: ...});
  }
};

for (var i = 0; i < urls.length; i+=2) {
  var dfd = callAjax(urls[i])();

  if(urls[i+1]) {
    dfd.then(callAjax(urls[i+1]));
  }
};

Answer 2

您必须使用Web worker执行昂贵的任务，而不会中断用户界面。

如果您想了解有关工人的知识，请访问：http://www.html5rocks.com/en/tutorials/workers/basics/

如果您只想在不理解的情况下使用它们，可以使用：http://www.w3schools.com/html/html5_webworkers.asp

Answer 3

您可以通过在获得2个先前发送的请求的响应后调用ajax请求来管理循环。

$(document).ready(function() {
    var dataUrl = ['1','2','3','4','5','6','7'];

    var completedRequest = 0;
    function getResults(start) {
        for(i=start; i < start+2; i++) {
            if(typeof (dataUrl[i]) != 'undefined') {
                $.ajax({
                    url: dataUrl[i],
                    complete: function(data) {
                        completedRequest ++;
                        if(completedRequest == 2 && (start+2) < dataUrl.length) {
                            getResults(start+2);
                            completedRequest = 0;
                        }   
                    }
                });
            }
        }
        completedRequest = 0;
     }
    //Initiate first request
    getResults(0);
});

修改后的代码。这是fiddle

检查控制台中的请求以便更好地理解。

Answer 4

或者您可以像这样调用ajax函数：

urlsArray = ['/echo/html/', '/echo/html/', '/echo/html/'];

arrayIndex = 0;
doAjax(arrayIndex);      

function doAjax(arrayIndex) {
    var urlCount = arrayIndex + 1;
    var theURL = urlsArray[arrayIndex];
    alert(urlCount + ", Start AJAXing the url: " + theURL);
    $.ajax({
        type: 'GET',
        url: theURL,
        dataType: 'json',
        success: function (data) {
            alert(urlCount + ", Done AJAXing the url: " + theURL);
            if (arrayIndex < urlsArray.length - 1) {
                arrayIndex += 1;
                doAjax(arrayIndex);
            }
        }
    });
}

<强>更新

更新了答案，这是一个JSFiddle演示：

JSFiddle

jquery中的多个Ajax请求冻结了浏览器

4 个答案: