@Quvi

Как остановить цикл по нажатию кнопки html / js?

У меня есть функция с циклом:
function snowFall() {
    while(true) {
        //функция
    }
}

и есть код проверки, нажата ли кнопка:
document.getElementById('break_while').onclick = function() {
    //что то
}


Куда мне вставить код прерывания, чтобы все работало корректно?
(Только не кидайте тапки и помидоры, я новичек)
  • Вопрос задан
  • 164 просмотра
Решения вопроса 3
yarkov
@yarkov Куратор тега JavaScript
Помог ответ? Отметь решением.
let isButtonClicked = false;

function snowFall() {
    while(isButtonClicked !== true) {
        //функция
    }
}

document.getElementById('break_while').onclick = function() {
    isButtonClicked = true;
}

snowFall();


Но что-то мне подсказывает, что пока цикл выполняется, кнопка будет некликабельна )))
Ответ написан
Aetae
@Aetae Куратор тега JavaScript
Тлен
Никак.
По умолчанию, без специальных ухищрений, javascript работает в одном потоке.
Пока цикл не завершится - вообще больше ничего не произойдёт, в т.ч. реакция на клик - страница тупо "зависает".
Ответ написан
Комментировать
@Shavadrius
<code lang="html">
<!DOCTYPE html>
<html>
<body>

<h2>My Hell looper</h2>

<button type="button" id="stopBtn">STOP THIS!!!</button>
<p id="counter"></p>

<p id="demo"></p>

<script>
let counter = 0, keepLooping = true;
const htmlCounter = document.getElementById("counter");
const step = () => {
  console.log(counter++);
  htmlCounter.innerHTML = counter;
}

const loop = () => {
  if (!keepLooping) {
  	htmlCounter.innerHTML = `stopped at ${counter} step by click!`;
  	return;	
  }
    step();
    setTimeout(loop, 1000);
}

const btn = document.getElementById("stopBtn");
btn.onclick = function(){
  keepLooping = false;
}
/*START HELL*/

loop();

</script>
</body>
</html>
</code>
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы