#javascript #html #timer
#javascript #HTML #таймер
Вопрос:
Как вы можете остановить цикл таймера вот пример кода:
<html>
<body>
<div><span id="time">05:00</span> minutes!
<button onclick="start5Timer()">start</button>
<button onclick="resetTimer()">reset</button>
</div>
</body>
<script>
let timerId;
function startTimer(duration, display) {
var timer = duration,
minutes, seconds;
timerId = setInterval(function() {
minutes = parseInt(timer / 60, 10);
seconds = parseInt(timer % 60, 10);
minutes = minutes < 10 ? "0" minutes : minutes;
seconds = seconds < 10 ? "0" seconds : seconds;
display.textContent = minutes ":" seconds;
if (--timer < 0) {
timer = duration;
}
}, 1000);
}
function resetTimer() {
clearInterval(timerId);
start5Timer();
}
function start5Timer() {
var fiveMinutes = 60 * 5,
display = document.querySelector('#time');
startTimer(fiveMinutes, display);
};
</script>
</html>
Вот ссылка на код: https://www.w3schools.com/code/tryit.asp?filename=GJQWAX7ZQK8B
это не скрипка js, это редактор tryit для школ W3
Комментарии:
1. ваша версия tryit editor работает нормально.
2. может быть, вы можете посмотреть эту ссылку, чтобы лучше понять, что ссылка , по сути, использует setInterval() для запуска и clearInterval() для остановки.
Ответ №1:
function stopTimer() {
clearInterval(timerId);
}
start5Timer();
внутри resetTimer()
перезапуск вашего таймера.