Javascript 如何在2秒的ajax成功中延迟

Javascript 如何在2秒的ajax成功中延迟,javascript,jquery,ajax,Javascript,Jquery,Ajax,我从每个循环中获取数据,所以我得到的响应非常快。我需要延迟。我尝试了每一件事(setTimeout),延迟,但没有任何好处。我认为我应该使用不同的方法,但我不知道如何使用。请帮忙,谢谢。这是我的密码: var counter = 0; var dataLength = 0; function processEachRow(data) { $("#LoadingImage").show(); var result = $.ajax({

我从每个循环中获取数据,所以我得到的响应非常快。我需要延迟。我尝试了每一件事(setTimeout),延迟,但没有任何好处。我认为我应该使用不同的方法,但我不知道如何使用。请帮忙,谢谢。这是我的密码:

    var counter = 0;
    var dataLength = 0;

    function processEachRow(data) {
     $("#LoadingImage").show();
     var result =
         $.ajax({
             type: 'POST',
             url: '/assessment/omr-evaluation/post-omr-skill-based-career-test.aspx',
             data: { row: data },
             async: false,

             success:
             function (data) {
                 counter = counter + 1;
                 if (counter < dataLength) {
                   $("#LoadingImage").show();
                 }
                 var arr = new Array();
                 var names = data;
                 arr = names.split('^');
                 //alert(arr);
                 //console.log(arr);
                 var userTable = $('#user_table_id');
                 if (userTable == null || userTable.length == 0) {
                     var table_html = "<table id='user_table_id'>";
                     table_html += "<tr><td>Name</td><td>Email</td><td>Phone</td><td>PDf</td></tr>";
                     table_html += "</table>";
                     $('#user_table_id').html(table_html);

                 }
                 newRow = "<tr><td>" + arr[0] + "</td><td>" + arr[1] + "     </td><td>" + arr[2] + "</td><td>" + arr[3] + "</td></tr>";
                 userTable.append(newRow);
                 $("#LoadingImage").hide();


             },
                    error: function (result) {
                    $("#LoadingImage").hide();
                    alert("Failed From Timeout");
                },

            })


        return result;
    }

    function processFiles() {
        d3.csv(("/assessment/omr-evaluation/uploaded-csv/" + $('#Label2').text()), function (data) {
            var dataLength = data.length;
            //alert(dataLength);
            $.each(data, function (i) {
                //var obj = jQuery.parseJSON(data[i]);
                var result = '';
                result = processEachRow(JSON.stringify(data[i]));
                //alert(i + result);

            });


        })
        return false;
    }
var计数器=0;
var-dataLength=0;
函数进程箭头(数据){
$(“#加载图像”).show();
var结果=
$.ajax({
键入:“POST”,
url:“/assessment/omr evaluation/post-omr基于技能的职业测试.aspx”,
数据:{row:data},
async:false,
成功:
功能(数据){
计数器=计数器+1;
if(计数器<数据长度){
$(“#加载图像”).show();
}
var arr=新数组();
变量名称=数据;
arr=names.split('^');
//警报(arr);
//控制台日志(arr);
var userTable=$('#user_table_id');
if(userTable==null | | userTable.length==0){
var表_html=“”;
表_html+=“NameEmailPhonePDf”;
表_html+=“”;
$('#user_table_id').html(table_html);
}
newRow=“”+arr[0]+“”+arr[1]+“”+arr[2]+“”+arr[3]+“”;
追加(newRow);
$(“#加载图像”).hide();
},
错误:函数(结果){
$(“#加载图像”).hide();
警报(“超时失败”);
},
})
返回结果;
}
函数processFiles(){
d3.csv(“/assessment/omr evaluation/upload csv/”+$(“#Label2”).text()),函数(数据){
var dataLength=data.length;
//警报(数据长度);
$。每个(数据、功能(i){
//var obj=jQuery.parseJSON(数据[i]);
var结果=“”;
result=processEachRow(JSON.stringify(数据[i]);
//警报(i+结果);
});
})
返回false;
}

请尝试像这样延迟ajax的成功:

// set your delay here, 2 seconds as an example...
var my_delay = 2000;

// call your ajax function when the document is ready...
$(function() {
    callAjax();
});

// function that processes your ajax calls...
function callAjax() {
    $.ajax({
        // ajax parameters here...
        // ...
        success: function() {
            setTimeout(callAjax, my_delay);
        }
    });
}

我不得不模拟它的很多部分,但我用一个取消公告的函数(由Ben Alman的jquery插件提供)组合了一个成功回调的示例,该函数在这里找到:

值得注意的是,如果没有这个插件,您可以相当轻松地编写一个带有setTimeout、回调和取消的debounce函数。您还可以在许多流行的函数样式库(如下划线或Lodash)中找到一个

我已经添加了很多注释试图解释它,但简单地说:我的successCb函数将由jquery ajax调用中的success函数实现(我嘲笑了这一点,因为我没有可以发布到的服务器)。它所做的只是将数据添加到数组中进行处理,并调用addRowsToTable函数。由于addRowsToTable函数是取消公告的,因此只有当对它的调用停止数毫秒(在我的示例中为150毫秒)时,它才会实际执行。在这种情况下,由于我的假响应时间是20ms,所以在所有数据返回后,它只执行一次。最后,由于DOM更新可能会很昂贵,我让它在循环外对所有可用行进行一次更新,而不是在循环中追加

剩下的几乎都是你已经有的嘲弄的东西

var行=[];
var pendingRequests=0;
//这些只是为了展示的目的。
var addrowscals=0;
var addrowspan=$(“#addrowscals”);
var successCbCalls=0;
var successCbSpan=$(“#successCbCalls”);
函数mockAjax(responsePayload、回调、延迟){
//使用这个而不是jqueryajax调用,因为我没有您的服务器端端点。
setTimeout(函数(){
回调(responsePayload)
},延误);
}
/*
这其中的神奇之处在于去盎司,它延迟了所提供函数的执行
直到对它的调用在提供的延迟期内停止(在本例中为150毫秒)。
这是通过此插件提供的:http://benalman.com/projects/jquery-throttle-debounce-plugin/
*/
var addRowsToTable=$.debounce(150,函数(){
//这三条线应该拆下。
addrowscals+=1;
addrowspan.text(addRowsCalls);
log('addRowsToTable called');
var userTable=$('#user_table_id');
var表_html=“”;
对于(变量i=0;i