Question

我正在运行一个每秒检查远程脚本并更新进度条的函数。我是setInterval的新手，并且在完成后让它停止循环有问题。

我已经在几个不同的地方添加了var interval帖子功能和clearInterval(interval); - 基本上就像遮住我的眼睛并将尾巴固定在驴上 - 并且没有成功。在clearInterval达到100后，我会在哪里设置data来停止循环？

function getProgress(hash) {
  setInterval(function() {
    $.ajax({
        type: 'GET',
        url: 'http://domain.com/script.php?hash=' + hash,
        cache: false,
        dataType: 'json',
        success: function(data) {
          if (data < 100) {
            getProgress();
          } else {
            $('#progress-bar').hide();
          }
        },
    });
  }, 1000);
}

Answer 1

假设您无法停止之前的间隔，这就是答案。您每次getProgress都会调用data < 100方法。哪个调用另一个setInterval方法，并为该时间间隔重新创建新的id。

假设getProgress方法在循环中调用多次，如果你这样做，

var intervalId;
function getProgress(hash) {
  intervalId = setInterval(function() {..}, 1000);
}

下次要停止间隔时，您需要拨打clearInterval(intervalId)。这非常错误。您有超过一个的时间间隔，而您恰好在前一个时间段仍在运行时停止了最后一个时间段，直到data < 100为 false 。

我建议将你的间隔ID存储在一个数组中，比如..

var intervalIds = [];
function getProgress(hash) {
  intervalId = setInterval(function() {..}, 1000);
  intervalIds.push(intervalId);
}

如果你想下次停止间隔，你可以这样做..

for (var idx in intervalIds) {
   clearInterval(intervalIds[idx]);
}

但是，这只是阻止所有间隔的一种方法。我在这里要说的是你的代码很丑陋。如果您使用setInterval方法的原因是等待1000 ms检索其他数据，那么setTimeout就可以正常完成工作。这是一个使用它并传回参数的示例。

function getProgress(hash){
   $.ajax({
        type: 'GET',
        url: 'http://domain.com/script.php?hash=' + hash,
        cache: false,
        dataType: 'json',
        success: function(data) {
          if (data < 100) {
            setTimeout(function() {
              getProgress(hash);
            }, 1000);
          } else {
            $('#progress-bar').hide();
          }
        },
    });
}

Answer 2

我假设您的代码在隐藏进度条时完成。您需要将Interval设置为某个变量，您可以使用它来清除它。

function getProgress(hash) {
  var someVariable = setInterval(function() {
    $.ajax({
        type: 'GET',
        url: 'http://domain.com/script.php?hash=' + hash,
        cache: false,
        dataType: 'json',
        success: function(data) {
          if (data < 100) {
            getProgress();
          } else {
            $('#progress-bar').hide();
            clearInterval(someVariable);
          }
        },
    });
  }, 1000);
}

Answer 3

很好的例子： http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_win_clearinterval

var myVar = setInterval(function() {
  myTimer()
}, 1000);

function myTimer() {
  var d = new Date();
  var t = d.toLocaleTimeString();
  document.getElementById("demo").innerHTML = t;
}

function myStopFunction() {
  clearInterval(myVar);
}

调用setInterval时，需要将返回值设置为变量。然后你可以使用这个参数调用clearInterval，它将停止。

jQuery setInterval问题

3 个答案: