Php 我想在响应通过ajax时更新进度条

我想用每一个响应更新进度条，但是用这段代码我一次得到很多响应，最后一个数字更新进度条。 但我无法在我的成功函数中得到每一个响应， 我还尝试了async:false，但由于此响应正在获取，但进度条不会仅在最后一次响应进度条更新时更新

function BindTable(jsondata, tableid) {
    /*Function used to convert the JSON array to Html Table*/
    var columns = BindTableHeader(jsondata, tableid); /*Gets all the column headings of Excel*/
    //Random Id Generation 
    var random = //Some Random Number
    var i = 0;
    for (; i < jsondata.length; i++) {
        var jData = {};
        for (var colIndex = 0; colIndex < columns.length; colIndex++) {
            var cellValue = jsondata[i][columns[colIndex]];
            // console.log(cellValue)
            jData[colIndex] = cellValue;
            if (cellValue == null)
                cellValue = "";
        }
        // console.log(jData);
        var jsonData = JSON.stringify(jData);
        console.log(jsonData);
        $.ajax({
            url: URL of PHP File,
            async: true,
            timeout: 30000,
            data: {
                "data": jsonData,
                "random": random,
                "current": i,
                "last": jsondata.length
            }, //<--- Use Object
            type: "POST",
            success: function (response, textStatus, hxr) {
                $('.progress-bar').css('width', response + '%').attr('aria-valuenow', response);
                if (response != 100)
                    $('#prvalue').html(response + '% Complete')
                if (response == 100)
                    $('#prvalue').html(response + '% Complete (Success)')
                console.log(response);
            },
            error: function (jqXHR, textStatus, errorThrown) {
                console.log("The following error occured: " +
                    textStatus, errorThrown);
            }
        });

    }
}

---

您可以尝试与async一起使用的示例代码： 您可以使用

.toFixed（0）

获取整数

function BindTable(jsondata, tableid) {
var columns = BindTableHeader(jsondata, tableid); /*Gets all the column headings of Excel*/
//Random Id Generation 
var random = 7; //Some Random Number
var progress = 0;

for(i = 0; i < jsondata.length; i++) {
    var jData = {};
    for (var colIndex = 0; colIndex < columns.length; colIndex++){
        var cellValue = jsondata[i][columns[colIndex]];
        jData[colIndex] = cellValue;
        if (cellValue == null) cellValue = "";
    }

    var jsonData = JSON.stringify(jData);
    console.log(jsonData);
    $.ajax({
        url: '', //URL of PHP File,
        async: true,
        timeout: 30000,
        data: {"data": jsonData,"random": random,"current": i,"last": jsondata.length},
        type: "POST"
    }).done(function(response, textStatus, hxr){
        progress = progress + 1;
        relative = ( progress * 100) / jsondata.length;

        $('.progress-bar').css('width', relative + '%').attr('aria-valuenow', relative);

        if (progress == jsondata.length){
            $('#prvalue').html(relative + '% Complete (Success)')
        }else{
            $('#prvalue').html(relative + '% Complete')
        }

        console.log(response, relative);

    }).fail(function (jqXHR, textStatus, errorThrown) {
        console.log("The following error occured: " + textStatus, errorThrown);
    })

   }
}

函数BindTable（jsondata，tableid）{
var columns=BindTableHeader（jsondata，tableid）；/*获取Excel的所有列标题*/
//随机Id生成
var random=7；//某个随机数
var进程=0；
对于（i=0；i

您可以尝试与async一起使用的示例代码： 您可以使用

.toFixed（0）

获取整数

function BindTable(jsondata, tableid) {
var columns = BindTableHeader(jsondata, tableid); /*Gets all the column headings of Excel*/
//Random Id Generation 
var random = 7; //Some Random Number
var progress = 0;

for(i = 0; i < jsondata.length; i++) {
    var jData = {};
    for (var colIndex = 0; colIndex < columns.length; colIndex++){
        var cellValue = jsondata[i][columns[colIndex]];
        jData[colIndex] = cellValue;
        if (cellValue == null) cellValue = "";
    }

    var jsonData = JSON.stringify(jData);
    console.log(jsonData);
    $.ajax({
        url: '', //URL of PHP File,
        async: true,
        timeout: 30000,
        data: {"data": jsonData,"random": random,"current": i,"last": jsondata.length},
        type: "POST"
    }).done(function(response, textStatus, hxr){
        progress = progress + 1;
        relative = ( progress * 100) / jsondata.length;

        $('.progress-bar').css('width', relative + '%').attr('aria-valuenow', relative);

        if (progress == jsondata.length){
            $('#prvalue').html(relative + '% Complete (Success)')
        }else{
            $('#prvalue').html(relative + '% Complete')
        }

        console.log(response, relative);

    }).fail(function (jqXHR, textStatus, errorThrown) {
        console.log("The following error occured: " + textStatus, errorThrown);
    })

   }
}

函数BindTable（jsondata，tableid）{
var columns=BindTableHeader（jsondata，tableid）；/*获取Excel的所有列标题*/
//随机Id生成
var random=7；//某个随机数
var进程=0；
对于（i=0；i

您将在

success

中获取数据从服务器获得响应后，您不能将

success

用于ProgressBar在更新状态栏时，多个ajax请求将相互竞争请参见：。这里是。计算将被请求的ajaxes的数量我猜是jsondata.length，然后使用成功回调实现计数器并刷新进度条上的数据。我建议使用.done和.fail来处理counter@gmazoni你能给我举个例子吗？从服务器得到响应后，你将在

success

中获得数据，您不能将

success

用于ProgressBar在更新状态栏时，多个ajax请求将相互竞争请参见：。下面是。计算将被请求的ajaxes的数量，我猜是jsondata.length，然后使用成功回调实现计数器并刷新进度条上的数据。我建议使用.done和.fail来处理counter@gmazoni你能给我举个例子吗？