javascriptのストップウオッチのコード
javascript初級勉強中です。
以下のコードを実行すると(1)小数点第2の動きがおかしい。
(2)一度リセットボタンを押さないとタイマーが動かない。
という2点の不具合が出ます。
どうすれば解決するでしょうか?
<!DOCTYPE HTML>
<head>
<meta charset="utf-8">
<title>ストップウォッチ</title>
</head>
<body>
<h1>ストップウオッチ</h1>
<div id="sec" style="font-size:128px">0.00</div>
<input type="button" value="Start!" onclick="run();">
<input type="button" value="Stop!" onclick="stop();">
<input type="button" value="Reset!" onclick="reset();">
<script>
var statTime,
stopTime,
running = false,
timerId;
function run() {
if (running)return;
running = true;
if (stopTime) {
startTime = startTime + (new Date()).getTime() - stopTime;
}
if (! startTime) {
startTime = (new Date()).getTime();
}
timer(); //タイマー処理回していく
}
function timer() {
document.getElementById('sec').innerHTML = (((new Date()).getTime()- startTime)/1000). toFixed(2);
timerId =setTimeout(function() { timer(); //このタイマー自身を回していく
}, 100);
}
function stop() {
if (!running) return false;
running = false;
clearTimeout(timerId); //timerIdを渡して止める
stopTime = (new Date()).getTime();
}
function reset() {
if (running) return;
startTime = undefined;
document.getElementById('sec').innerHTML = '0.00';
}
</script>
</body>
</html>
お礼
うーん、そこは問題ないように見えます・・。ありがとうございました。