jquery每秒调用ajax,直到调用完成/返回true

时间:2012-11-07 10:15:10

标签: javascript jquery javascript-events

我需要能够每秒调用一个函数“getProgress”。此函数执行ajax请求并更新进度条。当从ajax返回的调用为“true”时,我需要能够停止对该函数的调用。

HTML:

<td class="checkbox">
<input type="checkbox" value="6" class="checkbox download" id="chk-6">
<div class="hide" id="prgbar-6"><span class="progresslabel"></span></div>
</td>

我的职能:

function getProgress(operationId) { // receives operationId
    $.post("@Url.Action("Status","Packages")", { operationId: operationId }, function (data) {
        if (data) {
            for (var key in data) {
                if ($("#prgbar-" + key + "").size() != 0) {
                    var objPrg = $("#prgbar-" + key + "");
                    var objchk = $("#chk-" + key + "");
                    if (data[key]) {
                        objPrg.find("span").text("downloading...").css("color:#000000");
                        objchk.hide();
                        objPrg.removeClass("hide").show().progressbar({
                            value: 0
                        });
                        var value = Math.floor(parseInt(data[key]) * 100);
                        objPrg.progressbar("option", "value", value);
                        objPrg.find("span").text(value + "%");
                    } else {

                    }
                }
            }
        }
    });
}

3 个答案:

答案 0 :(得分:1)

var interval = setInterval(function(){getProgress(operationId,interval)},1000);

在$ .POST完整回调函数中,清除此时间间隔:{我在此处使用完成但如果您只想成功请求,请使用.success()}

$.post("@Url.Action("Status","Packages")", { operationId: operationId }, function (data) {
        if (data) {
            for (var key in data) {
                if ($("#prgbar-" + key + "").size() != 0) {
                    var objPrg = $("#prgbar-" + key + "");
                    var objchk = $("#chk-" + key + "");
                    if (data[key]) {
                        objPrg.find("span").text("downloading...").css("color:#000000");
                        objchk.hide();
                        objPrg.removeClass("hide").show().progressbar({
                            value: 0
                        });
                        var value = Math.floor(parseInt(data[key]) * 100);
                        objPrg.progressbar("option", "value", value);
                        objPrg.find("span").text(value + "%");
                    } else {

                    }
                }
            }
        }
    }).complete(function() { clearInterval(interval); });

答案 1 :(得分:1)

我喜欢这种方法。它不需要清除间隔。它只是自己运行并在必要时设置超时。

var operationId = ...;
var processFunction = function () {
        $.post("@Url.Action("Status","Packages")", { operationId: operationId }, function (data) {
            if (data !== true) {
                // your normal function stuff
                setTimeout(processFunction, 1000);
            }
        });
    };

setTimeout(processFunction, 1000);

答案 2 :(得分:0)

方法#1:

您可以在名为requestRunning的函数之外创建一个变量,并在调用getProgress时检查requestRunning是否为true。

// Pseudo-code
var requestRunning = false;
if requestRunning === true  => continue with getProgress
if requestRunning === false => stop firing getProgress

方法#2:

使用setInterval并在请求成功时清除间隔。

var progressHandle = setInterval(function(){getProgress(id)}, 1000);

$.ajax({
  success: function() {
    clearInterval(progressHandle);
  }
});

我可能更喜欢第一个选项,尽管通过后续的AJAX调用进行检查并不是很好。