I have following script:
document.getElementById("timer").innerHTML = 0 + ":" + 10;
function startTimer() {
var presentTime = document.getElementById("timer").innerHTML;
var timeArray = presentTime.split(/[:]+/);
var m = timeArray[0];
var s = checkSecond(timeArray[1] - 1);
if (s == 59) {
m = m - 1;
}
if (m < 0) {
return;
}
document.getElementById("timer").innerHTML = m + ":" + s;
console.log(m);
setTimeout(startTimer, 1000);
}
function checkSecond(sec) {
if (sec < 10 && sec >= 0) {
sec = "0" + sec;
} // add zero in front of numbers < 10
if (sec < 0) {
sec = "59";
}
return sec;
}<div class="sale_content">
СКИДКА АКТИВНА ЕЩЁ: <span id="timer"></span>
</div>All works great, but when timer expires it just shows "0:00"
How can I add expiration message inside ?
Thank you!
You can add your message expiry message, inside the minute expiry if block if (m<0){} before the return statement. I added the solution to your code below for reference
<div class="sale_content">
СКИДКА АКТИВНА ЕЩЁ: <span id="timer"></span>
</div>
<script>
document.getElementById('timer').innerHTML =
0 + ":" + 3;
function startTimer() {
var presentTime = document.getElementById('timer').innerHTML;
var timeArray = presentTime.split(/[:]+/);
var m = timeArray[0];
var s = checkSecond((timeArray[1] - 1));
if(s==59){m=m-1}
if(m<0){
document.getElementById('timer').innerHTML = "Timer expired."
return
}
document.getElementById('timer').innerHTML =
m + ":" + s;
console.log(m)
setTimeout(startTimer, 1000);
}
function checkSecond(sec) {
if (sec < 10 && sec >= 0) {sec = "0" + sec}; // add zero in front of numbers < 10
if (sec < 0) {sec = "59"};
return sec;
}
startTimer();
</script>
</body>
</html>
the problem is that you want to console.log(m) which is just 0:00. I've changed a bit of your code so instead of m it logs n which is: n = m + ":" + s;
<div class="sale_content">
СКИДКА АКТИВНА ЕЩЁ: <span id="timer"></span>
</div>
<script>
document.getElementById('timer').innerHTML =
0 + ":" + 10;
function startTimer() {
var presentTime = document.getElementById('timer').innerHTML;
var timeArray = presentTime.split(/[:]+/);
var m = timeArray[0];
var s = checkSecond((timeArray[1] - 1));
if(s==59){m=m-1}
if(m<0){
return
}
document.getElementById('timer').innerHTML =
n = m + ":" + s;
console.log(n)
setTimeout(startTimer, 1000);
}
function checkSecond(sec) {
if (sec < 10 && sec >= 0) {sec = "0" + sec}; // add zero in front of numbers < 10
if (sec < 0) {sec = "59"};
return sec;
}
</script>
try it like this
var timeleft = 11;
var downloadTimer = setInterval(function(){
if(timeleft <= 0){
clearInterval(downloadTimer);
alert("Timer Expired!")
return;
}
document.getElementById("progressBar").value = timeleft - 1;
document.getElementById("timer").innerHTML = "0:"+(timeleft - 1);
timeleft -= 1;
}, 1000);<div class="sale_content">
СКИДКА АКТИВНА ЕЩЁ: <span id="timer"></span>
</div>
<progress value="0" max="10" id="progressBar"></progress>