Javascript:10 秒后调用函数,然后每 1 分钟调用一次

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/31029757/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 13:08:49  来源:igfitidea点击:

Javascript: Call function after 10 seconds, then each 1 minute

javascriptjquery

提问by Ali Issa

I have the following scenario:

我有以下场景:

I have a javascript ajax function loadCars()that needs to be called after the page loads in 10 seconds, and then every 60 seconds.

我有一个 javascript ajax 函数loadCars(),需要在页面加载 10 秒后调用,然后每 60 秒调用一次。

The below is what I have tried so far:

以下是我迄今为止尝试过的:

setTimeout(function(){setInterval(function(){loadCars()}, 60000)}, 10000);

What is happening is that the function is being called after 10 seconds but never again, what am I missing?

发生的事情是该函数在 10 秒后被调用,但再也不会被调用,我错过了什么?

回答by rogeriolino

You need to call loadCarson setTimeoutand on setInterval.

你需要调用loadCarssetTimeoutsetInterval

setTimeout(function() {
    console.log('first 10 secs');
    // loadCars();
  
    setInterval(function() {
          console.log('60 secs has passed');
          // loadCars();
    }, 60000);

}, 10000);
console.log('page loaded');

回答by koningdavid

I don't agree with the answers given because they use setInterval or don't wait for the ajax call to be finished. IMO your should set a new timeout only when the function loadcars (and the ajax call) has finished.

我不同意给出的答案,因为他们使用 setInterval 或不等待 ajax 调用完成。IMO 你应该只在函数 loadcars(和 ajax 调用)完成时设置一个新的超时。

Example:

例子:

function loadCars () {
  // ajax call happens here
  $.ajax()
    .then(function(){
      // call the function here
      setTimeout(function(){
        loadCars();
      // wait a minute after you recieved the data
      }, 60000)
    })
}

// wait 10 seconds
setTimeout(function(){
  loadCars();
}, 10000)

The advantage if this is that it will only start setting a new timeout when the HTTP request is finished and prevent the function from getting out of sync. If you use setinterval in combination with an ajax call then the next ajax call will happen in 60 seconds even if the current one is delayed for 10 seconds (and you don't want that).

这样做的好处是它只会在 HTTP 请求完成时开始设置新的超时,并防止函数不同步。如果您将 setinterval 与 ajax 调用结合使用,那么即使当前调用延迟 10 秒(并且您不希望那样),下一个 ajax 调用也会在 60 秒后发生。

回答by skobaljic

To get more control over timings and function calls you could specify them all this way:

为了更好地控制时间和函数调用,您可以通过以下方式指定它们:

function loadCars() {
    $('#log').append('Cars loaded<br />');
};
function loadManufacturers() {
    $('#log').append('Manufacturers loaded<br />');
};
function loadCustomers() {
    $('#log').append('Customers loaded<br />');
};
function loadContent(delays, functions) {
    if (functions.length) {
        setTimeout(function () {
            functions.pop()();
            loadContent(delays, functions);
        }, delays.pop());
    };
};
loadContent([3000, 2000, 1000], [loadCars, loadManufacturers, loadCustomers]);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p id="log"></p>

Playground

操场

回答by brso05

You can call setTimeout(loadCars, 60000)in your loadCars()method that way you call it once initially with setTimeout10 seconds then from that point it sets a timeout for 1 minute out every time it executes...

您可以通过这种方式调用setTimeout(loadCars, 60000)您的loadCars()方法,您最初在setTimeout10 秒内调用它一次,然后从那时起,它每次执行时都会设置 1 分钟的超时......

function loadCars()
{
    //code
    setTimeout(loadCars, 60000);
}

setTimeout(loadCars, 10000);

If you want the next timeout to be scheduled only after ajaxcall is completed then either make a synchronus ajaxcall or put the setTimeout()in your successcallback of your ajaxcall...The latter being the better option.

如果只想之后的下一个超时被调度ajax呼叫完成然后要么做一个SYNCHRONUSajax看涨或看跌的setTimeout()success你的回调ajax电话...后者是更好的选择。