为什么我的setInterval函数不会停止

Question

我需要在javascript中编写setInterval函数。 这是代码：

var myTimer=setInterval(function(){ 
        var time=0;

        $.ajax({
            url:'...'
            type: "POST",
            dataType:"",
            success: function (response) {

                if(response=="true" || time>=10000){

                    clearInterval(myTimer);
                }
                time=time+1000;


            },
            error: function () {
                alert("FAIL");
            }
        });


        },1000);

我不知道为什么它不会在clearInterval中停止。 有人可以帮助我吗？

Answer 1

您声称该代码确实“在'if'中进来” ，所以我认为实际上正在进行clearInterval调用。

鉴于此，最有可能的解释是间隔已被清除（毕竟， select不会中断 ），但是在第一个"true"响应之前，您已经进行了多个ajax调用，而另一个调用了正在查看的是在清除间隔之前安排的时间。

例如，您的代码运行并：

1. 触发ajax调用＃1，这需要一秒钟以上的时间才能完成
2. 触发ajax调用＃2
3. Ajax调用＃1完成但不是"true"
4. 触发Ajax呼叫＃3
5. Ajax调用2已完成且为"true" ，清除了间隔
6. Ajax呼叫＃3完成

混合两个单独的异步间隔（一个通过setInterval和一个通过ajax ）是在麻烦。

如果目标是每秒发出一次请求，并在返回"true"时停止，那么我将让成功处理程序安排下一次调用，例如：

(function() {
    var time = 0;
    var started = 0;

    start();

    function start() {
        started = Date.now();
        $.ajax({
            url: '...'
            type: "POST",
            dataType: "",
            success: function(response) {
                if (response != "true") {
                    // Schedule the next call to occur one second after we
                    // started the previous call; or almost immediately if
                    // the call took more than a second to complete
                    setTimeout(start, Math.max(0, 1000 - (Date.now() - started)));
                }
                time = time + 1000;
            },
            error: function() {
                alert("FAIL");
            }
        });
    }

})();

Answer 2

让我举例说明预期情况和实际情况，以使事情更加清楚。

场景1

下图显示了所有ajax请求在一秒钟之前完成的情况。 您会注意到，ajax回调success （或error ）函数将仅在clearInterval （这是您一直期望的）之前执行。

场景2

当您的某些ajax请求花费一秒钟以上的时间（这可能发生）时，您的ajax回调可以在clearInterval 之前 / 之后 / 之后 / 之后触发，这使您感到setInterval 不会停止 。

请注意，您的time变量是无用的，因为它是一个函数范围的变量，您在每次函数调用时都将其初始化为0 。 即使它是一个全局变量，它也只会清除第11个成功函数回调中的时间间隔，而没有任何东西可以保证这11个成功请求将花费多长时间。

解

正如TJ Crowder建议的那样 ，最好在上一个调用的成功回调中安排下一个ajax调用，以确保您的ajax请求顺序触发（一次仅触发一次）。

注意 ：由于您是在回答后编辑问题的，因此您还需要编辑if条件，如下所示：

success: function(response) {
    if (response != "true" && time < 10000) {
    setTimeout(start, Math.max(0, 1000 - (Date.now() - started)));
    }
}