javascript - JS：不能用 clearInterval 停止 setInterval

Question

您好：我再次遇到问题。

我创建了使按钮工作的功能，嗯，不倒翁。但我找不到从另一个按钮状态用 clearInterval 停止 setInterval 的方法。

function goIdle(checker)
{
if(checker===1){
buttonDeeper.disabled=true;
var intIdle=(setInterval(goDeeperTest, 2000));//(600000-(bootTier*600)));
buttonIdle.value='Остановиться';
buttonIdle.addEventListener('click', function() {goIdle(2)}, false);
}
if (checker===2) {
clearInterval(intIdle);
buttonDeeper.disabled = false;
buttonIdle.value='Разбежаться';
buttonIdle.addEventListener('click', function() {goIdle(1)}, false);

}

Answer 1

该变量对于您的函数intIdle的一次执行是本地的。goIdle在外部范围内声明它，以便在函数执行之间保留它：

var intIdle;
function goIdle(checker)
{
if(checker===1){
buttonDeeper.disabled=true;
intIdle=(setInterval(goDeeperTest, 2000));//(600000-(bootTier*600)));
buttonIdle.value='Остановиться';
buttonIdle.addEventListener('click', function() {goIdle(2)}, false);
}
if (checker===2) {
clearInterval(intIdle);
buttonDeeper.disabled = false;
buttonIdle.value='Разбежаться';
buttonIdle.addEventListener('click', function() {goIdle(1)}, false);

}

但是您遇到的另一个问题是您似乎从未删除事件侦听器。因此，在每次单击时，您都会再调用其中一个。它行不通。你真正想要的是

buttonIdle.addEventListener('click', goIdle, false);
var intIdle;
function goIdle() {
    if (intIdle) {
        clearInterval(intIdle);
        buttonIdle.value='Разбежаться';
        buttonDeeper.disabled = false;
        intIdle = 0;
    } else {
        intIdle=setInterval(goDeeperTest, 2000);
        buttonDeeper.disabled = true;
        buttonIdle.value='Остановиться';
    }
}

Answer 2

代替

buttonIdle.addEventListener('click', function() {goIdle(2)}, false);

利用

buttonIdle.onclick = function() {goIdle(2)}, false);

否则你的按钮会一直有 2 个听众。