如何在我的函数中嵌套 setInterval 和 setTimeout？

Question

早上好，

我有一个 javascript 函数，它依次调用多个函数。我想在调用 javascript 函数后半秒触发函数（在我的示例中为 check1），随后每 10 秒（10000 毫秒）调用一次相同的函数 check1。做了一些研究后，我发现——虽然我可能是错的——setInterval 和 setTimeout 的组合会达成协议。

很遗憾，结果并不如预期。

后来，我用clearInterval()做了第二次尝试，但我也不确定如何嵌套这些不同的函数。

有没有一种优雅而聪明的方法来实现这一点？非常感谢您的帮助

下面是我的 javascript 代码：

// Global variables
var AutoScript = false;
var IntervalRefresh1 = 500;
var newIntervalDefined1 = false;

// calls the startUp method
startUp();


function startUp()
{
  console.log("I'm the startup2");
  setInterval(check1, IntervalRefresh1);
}


function check1()
{
  $.ajax({
  type: 'POST',
  url: 'php/checker1.php',
  dataType: 'json',
  data: {
  counter:$('#message-list').data('counter')
  }
  }).done(function( response ) {
  /* check if with response we got a new update */
  if(response.update==true)
  {
    var j = response.news;      
    $('#message-list').html(response.news);
    AutoScript = true;
    // here I call a specific method named after getDataFromDatabase(j);
    AutoScript = false;        
    if (newIntervalDefined1 == false)
    {
      setTimeout(check1, 10000);
      newIntervalDefined1 == true;
    }
  }
  });
}

Answer 1

切勿将 setInterval 与 async/ajax

一起使用

只需使用 setTimeout

或移动

setTimeout(check1, 10000);

你的特殊功能

// Global variables
var AutoScript = false;

function check1() {
  $.ajax({
    type: 'POST',
    url: 'php/checker1.php',
    dataType: 'json',
    data: {
      counter: $('#message-list').data('counter')
    }
  }).done(function(response) {
    /* check if with response we got a new update */
    if (response.update == true) {
      var j = response.news;
      $('#message-list').html(response.news);
      AutoScript = true;
      // here I call a specific method named after getDataFromDatabase(j);
      AutoScript = false;
      setTimeout(check1, 10000);
    }
  });
}
$(function() {
  check1()
})

Answer 2

问题是您在一段时间内调用 check1 但没有清除它。所以这将每 500 毫秒被调用一次。

setInterval(check1, IntervalRefresh1);

在顶部，您使用 setTimeout 再次调用该函数。你也必须在某个时候根据条件清除它，这样它就不会无限地运行。查看代码和注释。

var timerinterval;
var timeout;
function startUp()
{
  console.log("I'm the startup2");
  timerinterval = window.setInterval(check1, IntervalRefresh1); //set a timerInterval
}


function check1()
{
  $.ajax({
  type: 'POST',
  url: 'php/checker1.php',
  dataType: 'json',
  data: {
  counter:$('#message-list').data('counter')
  }
  }).done(function( response ) {
  /* check if with response we got a new update */
  if(response.update==true)
  {
    var j = response.news;      
    $('#message-list').html(response.news);
    AutoScript = true;
    // here I call a specific method named after getDataFromDatabase(j);
    AutoScript = false;        
    if (newIntervalDefined1 == false)
    {
      clearInterval(timerinterval); //clear the interval timer
     timeout =  setTimeout(check1, 10000); //now clear this too at some point of time so that it doesn run infinitely
      newIntervalDefined1 == true;
    }
  }
  });

如何在我的函数中嵌套 setInterval 和 setTimeout？

How can I nest setInterval and setTimeout in my function?

javascript

settimeout

setinterval