Javascript 暂停设置间隔

我使用setInterval每隔几秒钟运行一个函数（执行AJAX操作）。但是我还有一个函数也调用它

setInterval(myFunc(), 5000);
function buttonClick() {
  // do some stuff
  myFunc();
}

大多数时候它都能工作，但是有时候这个函数会同时被调用两次，导致两次收到完全相同的结果，这是我不想要的

我想我必须使用clearTimeout：

var interval = setInterval(myFunc(), 5000);
function buttonClick() {
  clearTImeout(interval);
  // do some stuff
  myFunc();
  interval = setInterval(myFunc(), 5000);
}

---

但是，这会导致函数停止。因为它是从其他函数调用的，所以一些代码永远不会执行。如何防止这种情况发生？

除非

myFunc

返回一个我将执行此操作的函数（也使用

clearInterval

代替

clearTimeout

）：

setInterval

要求其参数中包含函数。您可以使用

myFunc（）

调用函数。因此，

myFunc

返回的任何内容都被传递给了

setInterval

，这可能不是您想要的

然而，有时这个函数会同时被调用两次，导致两次收到完全相同的结果，这是我不想要的

浏览器上的JavaScript是单线程的（除非使用新的东西，但这在这里并不适用）。您的函数在运行时永远不会被调用。（但下面还有更多。）

在各种代码引号中，您调用的是

myFunc

，您的意思是只引用它。例如：

var interval = setInterval(myFunc(), 5000);

应该是

var interval = setInterval(myFunc, 5000);
//                               ^--- No parentheses

如果您纠正以下情况，取消超时的代码将起作用：

var interval = setInterval(myFunc, 5000);
function buttonClick() {
  clearTImeout(interval);
  // do some stuff
  myFunc();
  interval = setInterval(myFunc, 5000);
}

但是没有理由这样做，

myFunc

在运行时无法被调用

如果

myFunc

正在触发将异步完成的某个内容（例如，一个ajax调用），则上述将不会提供帮助（原因很简单，

myFunc

将启动流程，然后返回；流程将单独完成）。在这种情况下，最好让

myFunc

自己安排下一次调用：

function myFunc() {
    // Do my work...

    // Schedule my next run
    setTimeout(myFunc, 5000);
}

---

…而且根本不使用

setInterval

。

我意识到已经有两种解决方案，但我想我会展示一种不仅仅是“这样做”的解决方案。我倾向于以身作则，并认为我会推广同样的做法。话虽如此，但我也会尽力解释

// Here we assign the function to a variable that we can use as an argument to the
// setInterval method.
var work = function(){
    // performing a very simple action for the sake of demo
    $('#log').append('Executed.<br />');
};

// this is a variable that is essentially used to track if the interval is or is
// not already running. Before we start it, we check it. Before we end it, we also
// check it. Let's start off with it started though
var worker = setInterval(work, 5000);

// bind to the start button
$('#start').click(function(){
    // Test: is the worker already running?
    if (worker)
        // Yes it is, don't try to call it again
        $('#warn').text('Timer already running!');
    else{
        // no it's not, let's start it up using that function variable we declared
        // earlier
        worker = setInterval(work,3000);
        $('#warn').text('Started!');
    }
});

// bind to the stop button
$('#stop').click(function(){
    // test: is the worker running?
    if (!worker)
        // no, so we can't stop it
        $('#warn').text('Timer not running!');
    else{
        // yes it's working. Let's stop it and clear the variable.
        clearInterval(worker);
        worker = null;
        $('#warn').text('Stopped.');
    }
});

//这里我们将函数分配给一个变量，该变量可以用作
//setInterval方法。
var work=function（）{
//为了演示而执行一个非常简单的操作
$（'#log'）.append（'Executed.
'）；
};
//这是一个变量，主要用于跟踪间隔是否为
//还没有运行。在开始之前，我们先检查一下。在我们结束之前，我们也
//检查一下。让我们从它开始吧，开始吧
var-worker=setInterval（工时，5000）；
//绑定到开始按钮
$（“#开始”）。单击（函数（）{
//测试：工作进程是否已在运行？
如果（工人）
//是的，是的，不要再打电话了
$（'#warn'）.text（'计时器已在运行！'）；
否则{
//不，不是，让我们用我们声明的函数变量启动它
//早些时候
工人=设定间隔（工作，3000）；
$（'#warn'）.text（'Started！'）；
}
});
//绑定到停止按钮
$（'#停止'）。单击（函数（）{
//测试：工人正在运行吗？
如果（！工人）
//不，所以我们不能阻止它
$（'警告'）.text（'计时器未运行！'）；
否则{
//是的，它正在工作。让我们停止它并清除变量。
清除间隔（工人）；
worker=null；
$（'警告'）.text（'已停止'）；
}
});

似乎您希望将结果放在一个对象中，任何感兴趣的人都可以访问该对象，因此您可以执行发布-订阅想法，当您获得新值时，将其推到任何地方。你的问题好像是设计。你是说

setInterval（myFunc，5000）（）

？如何防止多次执行的示例：（请原谅使用jQuery，但希望简单地输出数据）。

// Here we assign the function to a variable that we can use as an argument to the
// setInterval method.
var work = function(){
    // performing a very simple action for the sake of demo
    $('#log').append('Executed.<br />');
};

// this is a variable that is essentially used to track if the interval is or is
// not already running. Before we start it, we check it. Before we end it, we also
// check it. Let's start off with it started though
var worker = setInterval(work, 5000);

// bind to the start button
$('#start').click(function(){
    // Test: is the worker already running?
    if (worker)
        // Yes it is, don't try to call it again
        $('#warn').text('Timer already running!');
    else{
        // no it's not, let's start it up using that function variable we declared
        // earlier
        worker = setInterval(work,3000);
        $('#warn').text('Started!');
    }
});

// bind to the stop button
$('#stop').click(function(){
    // test: is the worker running?
    if (!worker)
        // no, so we can't stop it
        $('#warn').text('Timer not running!');
    else{
        // yes it's working. Let's stop it and clear the variable.
        clearInterval(worker);
        worker = null;
        $('#warn').text('Stopped.');
    }
});