Javascript，切换 setInterval

Question

我正在尝试制作一个小脚本，其中屏幕将每 100 毫秒随机更改一次背景颜色，您可以通过按一个按钮来打开和关闭它。我可以让它开始，但我不能让它停止。

这里是切换的主要代码：

var on = -1;

function change() {
    on = on*-1;
    if (on == true) {
        var light = window.setInterval(disco,100);
    }
    else {
        window.clearInterval(light);
    }
}

disco 是改变背景颜色的函数。

我尝试了许多不同的变体，但我认为这是我得到的最接近的。尽管on 变量在1 和-1 之间正确切换，但现在单击该按钮只能设置另一个间隔。我没有正确使用 clearInterval 吗？

完整的 JSFiddle 在这里：http://jsfiddle.net/VZdk9/

我正在尝试练习 JavaScript，所以请不要使用 jQuery :)

Answer 1

您的变量 light 存在范围问题，因为它是在 change() 函数中定义的。为了跟踪区间 ID，您需要将其设为全局变量。

var light;

function change() {
    if (!light) {
        light = window.setInterval(disco,100);
    } else {
        window.clearInterval(light);
        light = null;
    }
}

我还删除了您的变量on，因为它的可能值-1 和1 都是truthy。你真的只需要使用一个变量，因为如果间隔已被清除，light 将被重置为null。如果此变量由另一个函数控制，请随时将其更改回来。

Answer 2

var light = null;
function change () {
    if (light === null) {
        light = window.setInterval(disco, 100);
    } else {
        window.clearInterval(light);
        light = null;
    }
}