Свой велосипедный секундомер
Он работает не точно. Существует довольно большая погрешность. Почему? И как исправить?
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="clock">
<span id="hours">00</span>
:
<span id="minutes">00</span>
:
<span id="seconds">00</span>
</div>
<button id ="start">Старт</button>
<button id = "stop" onclick="clearInterval(st)">Стоп</button>
</body>
<script>
var hours = document.getElementById("hours");
var minutes = document.getElementById("minutes");
var seconds = document.getElementById("seconds");
var start = document.getElementById("start");
var stop = document.getElementById("stop");
var h = 0;
var m = 0;
var s = 0;
var right = true;
var count;
var stopwatch = function(){
if (right) {
count = setInterval (function() {
s++;
if (s == 60) {
s = 0;
m++;
}
if (m == 60) {
m = 0;
h++;
}
if (h == 24) {
h = 0;
}
hours.innerHTML = h;
minutes.innerHTML = m;
seconds.innerHTML = s;
if (hours.innerHTML == 0) hours.innerHTML = "0" + hours.innerHTML;
if (hours.innerHTML < 10 && hours.innerHTML.charAt(0) != 0) {
hours.innerHTML = "0" + hours.innerHTML;
}
if (minutes.innerHTML == 0) minutes.innerHTML = "0" + minutes.innerHTML;
if (minutes.innerHTML < 10 && minutes.innerHTML.charAt(0) != 0) {
minutes.innerHTML = "0" + minutes.innerHTML;
}
if (seconds.innerHTML < 10 && seconds.innerHTML.charAt(0) != 0) {
seconds.innerHTML = "0" + seconds.innerHTML;
}
},
1000);
}
right = false;
}
var rightToFalse = function() {
if (right == false) right = true;
}
start.addEventListener("click", stopwatch);
stop.addEventListener("click", rightToFalse);
</script>
</html>
|
Тут:
http://javascript.ru/forum/misc/1566...html#post95613 Объясняется в чем беда. Цитата:
Будет ли тут погрешность? |
Цитата:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<span id="hours">00</span>:<span id="mins">00</span>:<span id="secs">00</span>:<span id="ms">000</span><br>
<button onclick="runTimer()">start</button>
<script>
var hSpan = document.getElementById('hours'),
minSpan = document.getElementById('mins'),
secSpan = document.getElementById('secs'),
msSpan = document.getElementById('ms');
function runTimer() {
var beginTime = new Date();
setInterval(function() {
var delta = new Date() - beginTime;
var hours = Math.floor(delta/3600000);
delta = delta - hours*3600000;
var mins = Math.floor( delta/60000 );
delta = delta - mins*60000;
var secs = Math.floor( delta/1000 );
delta = delta - secs*1000;
var ms = delta;
hSpan.innerHTML = format(hours, 2);
minSpan.innerHTML = format(mins, 2);
secSpan.innerHTML = format(secs, 2);
msSpan.innerHTML = format(ms, 3);
}, 50);
}
function format(num, maxNumbers) {
var numStr = num + '';
while(numStr.length < maxNumbers) {
numStr = '0' + numStr;
}
return numStr;
}
</script>
</body>
</html>
|
jsnb,
Я примерно так и думал. Но мысль пришла поздно, сон поборол меня вчера. Функция format - красивое решение. А delay у setInterval почему выставлено в 50? Второй раз встречаю именно это число, чем оно обоснованно? Смею предположить что и тут будет погрешность. Наверное нужно узнать когда она (погрешность) достигнет секунды, например через 1 час, тогда необходимо функцию перезапустить и начать считать с последнего значения. |
| Часовой пояс GMT +3, время: 08:49. |