All geek questions in one place

How to show milliseconds in javascript timer counter

I have a javascript code that shows a countdown timer from 5 minutes.

This is the code

var mins var secs; function cd() { mins = 1 * m("05"); // change minutes here secs = 0 + s(":00"); // change seconds here (always add an additional second to your total) redo(); } function m(obj) { for(var i = 0; i < obj.length; i++) { if(obj.substring(i, i + 1) == ":") break; } return(obj.substring(0, i)); } function s(obj) { for(var i = 0; i < obj.length; i++) { if(obj.substring(i, i + 1) == ":") break; } return(obj.substring(i + 1, obj.length)); } function dis(mins,secs) { var disp; if(mins <= 9) { disp = " 0"; } else { disp = " "; } disp += mins + ":"; if(secs <= 9) { disp += "0" + secs; } else { disp += secs; } return(disp); } function redo() { secs--; if(secs == -1) { secs = 59; mins--; } var timerStr = dis(mins,secs); $("#countDownTimer").text(timerStr); // setup additional displays here. if((mins == 0) && (secs == 0)) { } else { cd = setTimeout("redo()",1); } } function init() { cd(); } window.onload = init;

How can I change the script to show milliseconds too

or is there a simple script to show the countdown timer, including minutes: seconds: milliseconds

+4
source share
3 answers

I reworked the code to include milliseconds. Also make sure setTimer is set correctly.

 var mins var secs; var ms; function cd() { mins = 1 * m("05"); // change minutes here secs = 0 + s(":00"); // change seconds here (always add an additional second to your total) ms = 0 + ms(":00");//change millisecons here redo(); } function m(obj) { for(var i = 0; i < obj.length; i++) { if(obj.substring(i, i + 1) == ":") break; } return(obj.substring(0, i)); } function s(obj) { for(var i = 0; i < obj.length; i++) { if(obj.substring(i, i + 1) == ":") break; } return(obj.substring(i + 1, obj.length)); } function ms(obj) { for(var i = 0; i < obj.length; i++) { if(obj.substring(i, i + 1) == ":") break; } return(obj.substring(i + 1, obj.length)); } function dis(mins,secs,ms) { var disp; if(mins <= 9) { disp = " 0"; } else { disp = " "; } disp += mins + ":"; if(secs <= 9) { disp += "0" + secs; } else { disp += secs + ":"; } if(ms <= 9) { disp += "0" + ms; } else { disp += ms; } return(disp); } function redo() { ms--; if(ms == -1) { ms = 99; secs--; } if(secs == -1) { secs = 59; mins--; } var timerStr = dis(mins,secs,ms); document.getElementById('countdown_fld').innerText=timerStr; // setup additional displays here. if((mins == 0) && (secs == 0) && (ms == 0)) { } else { cd = setTimeout("redo()",10); //make sure to set the timer right } } function init() { cd(); }
+2
source

You call a timeout with parameter 1 , which means 1 millisecond for the timer event, but you treat this millisecond event as a full second in your redo() function.

redo () should be:

 function redo() { s -= 0.001; // subtract 1 millisecond if (s < 0) { secs = 59.999; mins--; } }

etc. However, given that running this code every milliseconds will lead to a rather large load on the browser and will not work accurate to the millisecond. When starting the countdown, you must track the TIME by recording the current system time using the Date () object, which has millisecond accuracy.

Call your repeat () at a longer interval than milliseconds (say, every 200 ms / 0.2 seconds), and then subtract the system time at that point from the start of the timer.

+2
source

Source: https://habr.com/ru/post/1380409/

More articles:


All Articles