我需要javascript倒计时器根据小时数工作。例如如果它是5'o时钟,那么时钟应该从1小时重置。当它是6'时钟时,它应该再次复位并开始倒计时。
喜欢这个网站 - > https://phorge.com.au/the-dental-edge-webinar
我想使用以下JS。如果可以修改它会很棒。
<script>
var startTime = 59.99; //in Minutes
var doneClass = "done"; //optional styling applied to text when timer is done
function startTimer(duration, display) {
var timer = duration, minutes, seconds;
var intervalLoop = 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) {
document.querySelector("#timer").classList.add(doneClass);
clearInterval(intervalLoop);
}
}, 1000);
}
window.onload = function () {
var setMinutes = 60 * startTime,
display = document.querySelector("#timer");
startTimer(setMinutes, display);
};
/**
* Do not remove this section; it allows our team to troubleshoot and track feature adoption.
* TS:0002-03-069
*/
</script>
答案 0 :(得分:2)
只需获取当前时间并从startTime
中减去分钟和秒数。由于这是一个每小时倒计时器,你不在乎它是什么小时,只剩下多少分钟和秒。
var startTime = 59.99; //in Minutes
var doneClass = "done"; //optional styling applied to text when timer is done
function startTimer(duration, display) {
var timer = duration,
minutes, seconds;
var intervalLoop = 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) {
document.querySelector("#timer").classList.add(doneClass);
clearInterval(intervalLoop);
}
}, 1000);
}
window.onload = function() {
var now = new Date();
var hour = now.getHours();
if (hour > 12) {
hour = hour - 11 + " PM"
} else {
hour = hour + 1 + " AM"
}
document.getElementById("hour").textContent = "Until " + hour;
var setMinutes = 60 * (startTime - now.getMinutes() - (now.getSeconds() / 100)),
display = document.querySelector("#timer");
startTimer(setMinutes, display);
};
<span id="timer"></span><br/>
<span id="hour"></span>