Javascript范围,使用间隔启动停止按钮

时间:2018-09-04 18:10:47

标签: javascript scope

我的示波器有问题。

我有一个无法使用的停止按钮。 “开始”按钮效果很好,但我似乎无法使“停止”按钮正常工作,我知道它与范围有关。我将不胜感激任何帮助。

let css = document.querySelector('h3');
let color1 = document.querySelector(".color1");
let color2 = document.querySelector(".color2");
let color3 = document.querySelector(".color3");
let degree = document.querySelector(".degree");
let body = document.getElementById("gradient");
let deg = document.getElementById("deg");
let random = document.getElementById("random");
let start = document.getElementById("start");
let stop = document.getElementById("stop");


function setGradient() {
  body.style.background =
    "linear-gradient(" +
    degree.value +
    "deg, " +
    color1.value +
    ", " +
    color2.value +
    ", " +
    color3.value +
    ")";

  css.textContent = body.style.background + ";";
  deg.textContent = degree.value;
}

function increment() {
  degree.value = 0;
  setInterval(function() {
    degree.value = degree.value % 360 + 1;
    setGradient();
    if (degree.value == 359) {
      increment();
    }
  }, 100);
}

start.addEventListener("click", increment);

stop.addEventListener("click", function() {
  clearInterval(counter);
});

color1.addEventListener("input", setGradient);
color2.addEventListener("input", setGradient);
color3.addEventListener("input", setGradient);
degree.addEventListener("input", setGradient);

window.onload = setGradient;

1 个答案:

答案 0 :(得分:0)

您必须分配counter变量。

counter = setInterval(..)