я не могу остановить setInterval - PullRequest
0 голосов
/ 24 мая 2018

У меня есть два buttons.Один onClick запускает функцию, которая использует var intId = setInterval{function(), 30} На втором button я пытаюсь остановить setInterval с помощью clearInterval(intId), но intId не является глобальным, и если я помещаю весь setInterval вне функциикнопка, которую он не может запустить.

кнопка запуска

var intID == 0;

function runButton() {
  var c = document.getElementById("can1");
  var ctx = c.getContext("2d");

  var speed = 2;
  var posX = 20;
  var posY = 20;

  var intID = setInterval(function() {
    posX += speed;
    ctx.clearRect(0, 0, c.width, c.height);

    ctx.fillStyle = "black";
    ctx.fillRect(posX, posY, 20, 20);

    if (intID == 1) {
        clearInterval(intID);
        }
  }
      , 30);

}

кнопка остановки

function stopButton() {
  var c = document.getElementById("can1");
  var ctx = c.getContext("2d");


  clearInterval(intID);
  intID == 1;

  ctx.clearRect(0, 0, c.width, c.height);
  c.style.backgroundColor = red;
}

1 Ответ

0 голосов
/ 24 мая 2018

Попробуйте следующим образом.

var intervalID = 1;

function runButton() {
  var c = document.getElementById("can1");
  var ctx = c.getContext("2d");

  var speed = 2;
  var posX = 20;
  var posY = 20;

  var intID = setInterval(function() {
    posX += speed; //variable 'x' had to change to 'posX'
    ctx.clearRect(0, 0, c.width, c.height);

    ctx.fillStyle = "black";
    ctx.fillRect(posX, posY, 20, 20);

    if(intervalID == 0) {
        clearInterval(intID);
    }
  }, 30);
}

function stopButton() {
  var c = document.getElementById("can1");
  var ctx = c.getContext("2d");

  intervalID = 0;

  ctx.clearRect(0, 0, c.width, c.height);
  c.style.backgroundColor = red;
}
...