Question

您好我正在使用Java Script计时器，它在IE中运行良好但在Chrome中当窗口最小化时它会变得太慢，在Mozilla中它会停止计时器。谁能提出任何建议？我的代码如下： -

<html>
<head>
<script>

var millisec = 0;
var seconds = 0;
var timer;

function display(){

  if (millisec>=9){
     millisec=0
     seconds+=1
  }
  else
     millisec+=1
     document.d.d2.value = seconds + "." + millisec;
     timer = setTimeout("display()",100);
  }

function starttimer() {

  if (timer > 0) {
    return;
  }
  display();    
}
function stoptimer() {
  clearTimeout(timer);
  timer = 0;
}

function startstoptimer() {
  if (timer > 0) {
     clearTimeout(timer);
     timer = 0;
  } else {
     display();
  }
}

function resettimer() {
    stoptimer();
    millisec = 0;
    seconds = 0;
}



</script>
</head>
<body>
<h5>Millisecond Javascript Timer</h5>
<form name="d">
<input type="text" size="8" name="d2">
<input type="button" value="Start/Stop" onclick="startstoptimer()">
<input type="reset" onclick="resettimer()">
</form>

</body></html>

Answer 1

您不能使用setTimeout来制作可靠的时间保留脚本。

John Resig解释了JavaScript定时器的工作原理：http://ejohn.org/blog/how-javascript-timers-work/

简短版本总是有一个小延迟。传递给setTimeout的毫秒参数是“尽力而为”。

如果您想要显示实时计时器，请考虑经常轮询时间。如果事件循环速度变慢，则对跟踪时间的能力没有影响，只会减少更新。

http://jsfiddle.net/64pcr7pw/

<script type="text/javascript">
var timer, time = 0, start_time = 0;
function startstoptimer() {
    if (timer) {
        time += new Date().getTime() - start_time;
        start_time = 0;
        clearInterval(timer);
        timer = null;
    } else {
        start_time = new Date().getTime();
        timer = setInterval(function () {
            document.d.d2.value = time + new Date().getTime() - start_time;
        }, 10);
    }
}
function resettimer() {
    time = 0;
    start_time = new Date().getTime();
    document.d.d2.value = "0";
}
</script>

<form name="d">
    <input type="text" size="8" name="d2"/>
    <input type="button" value="Start/Stop" onclick="startstoptimer()"/>
    <input type="reset" onclick="resettimer()" />
</form>

计时器JavaScript未在Chrome＆amp;窗口最小化时的Mozilla

1 个答案: