jQuery AJAX请求之间的时间延迟

time delay between jQuery AJAX requests

本文关键字：时间延迟 之间 请求 AJAX jQuery      更新时间：2023-09-26

我建立了一个小的内部web应用程序，查找区号。我遇到的问题是，我有很多地区代码要通过。以至于我的应用程序开始出错。

我想在它里面建立一个计时器，这样我就可以每秒触发一个请求，直到我的数组结束。什么好主意吗?

var phoneList = ["905XXXXXXX","905XXXXXXX","905XXXXXXX","905XXXXXXX","905XXXXXXX",...];
var phoneList_length = phoneList.length;
for(i=0; i < phoneList_length; i++){    
    $.ajax({
        url: 'http://mysite.com/webservice.php',
        dataType: 'jsonp',
        data: 'number=' + phoneList[i] + '&index=' + i,
        type: 'GET',
        timeout: 10000,
        success: function(data){
            $('.phoneReults').append('<li>' + phoneList[data.index] + '</li>');
            $('.stateReults').append('<li>' + data.region +'</li>');
            $('.cityReults').append('<li>' + data.city +'</li>');
        }
    });
}

function fire(request, i) {
    var phone = request.shift();
    $.ajax({
        url: 'http://mysite.com/webservice.php',
        dataType: 'jsonp',
        data: 'number=' + phone + '&index='  + i,
        etc: ...
    });
    if (request.length > 0)
        setTimeout(fire, 1000, request, ++i);
}
...
// start requests
fire(phoneLists, 0);

var phoneList = ["905XXXXXXX","905XXXXXXX","905XXXXXXX","905XXXXXXX","905XXXXXXX",...];
var time = 1000;
$.each(phoneList, function(index, phone) {
    window.setTimeout(function() {
        $.ajax({
            url: 'http://mysite.com/webservice.php',
            dataType: 'jsonp',
            data: { number: phone, index: index },
            success: function() {
                ...                  
            }  
        });
    }, time);
    time += 1000;
});

您最好为整个数组触发一个请求。这将为您节省大量请求以及服务器端的大量初始化和结束。如果数组非常大，您可以选择发送它的块(比如一次发送10个或100个)。

如果之后仍然需要数组，可以跳过for循环。相反，创建一个在请求的成功处理程序中调用自身的函数。重复此操作，直到全局变量到达数组的末尾。

您可以有一个数组的ajax请求有一个串行ajax调用(您可以调用一个接一个的前一个是成功的)。或者你可以让递归函数在成功函数触发后再次调用自己

试试这个

var phoneList = ["905XXXXXXX","905XXXXXXX","905XXXXXXX","905XXXXXXX","905XXXXXXX",...];
var phoneList_length = phoneList.length;
var count = 0;
var timer = setInterval(function(){
  if(count != phoneList_length){
    SendPhoneList(phoneList[count]);
    count++;
  }
  else{
     clearInterval(timer);
  }
}, 1000);

function SendPhoneList(phoneList){
  $.ajax({
        url: 'http://example.com/webservice.php',
        dataType: 'jsonp',
        data: 'number=' + phoneList + '&index=' + i,
        type: 'GET',
        timeout: 10000,
        success: function(data){
            $('.phoneReults').append('<li>' + phoneList[data.index] + '</li>');
            $('.stateReults').append('<li>' + data.region +'</li>');
            $('.cityReults').append('<li>' + data.city +'</li>');
        }
    });
}
相关文章：