Javascript, toggle 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() , Чтобы отслеживать идентификатор интервала, вам нужно сделать глобальную переменную.

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; 
    } 
}