Question

希望我能在这里说清楚。

我使用以下代码来运行我的秒表：

function timecounter(starttime)
    {
    currentdate = new Date();
    details = document.getElementById('details');
    stopwatch = document.getElementById('stopwatch');

    var timediff = currentdate.getTime() - starttime;
    if(runningstate == 0)
        {
        timediff = timediff + stoptime
        }
    if(runningstate == 1)
        {
        stopwatch.value = formattedtime(timediff);
        refresh = setTimeout('timecounter(' + starttime + ');',10);
        }
    else
        {
        window.clearTimeout(refresh);
        stoptime = timediff;
        }
    }

function startandstop()
  {
  var startandstop = document.getElementById('startandstopbutton');
  if(runningstate==0)
{
 startandstop.value = 'Pause';
 runningstate = 1;
 timecounter(starttime);
 }
else
  {
  startandstop.value = 'Start';
  runningstate = 0;
  lapdate = '';
  }
 }

但是当我选择按钮暂停时间时，时间停止，但是当我再次按下开始时，它会跳转到当前时间，就像我没有暂停时间一样。

我一直试图找出它发生了什么并且没有成功。

我相信它可能与timecounter（）函数有关，但从那里我不确定。

非常感谢任何帮助！

谢谢，布兰登

Answer 1

我认为你应该使用.performance.now（），如果你想要一些接近于毫秒精确的东西。

以为你有一个有趣的问题所以我想出了一个有趣的解决方案。希望能帮助到你。：）（更新以下代码）

http://jsfiddle.net/colbycallahan/CjDz7/1/（稍微清理一下以显示并稍微四舍五入）

工作并需要jQuery：

HTML：

<div id="console"></div>
<input type="button" id="btn" value="start time">
<input type="button" id="btn2" value="stop time">

JS：

var timerRunning = false;
var startTime;
var totalTime;
$('#console').data('totalTime', 0);

function startTimer(){
    totalTime = $('#console').data('totalTime');
    startTime = window.performance.now();
    timerRunning = true;

    function timerLoop(){
        window.setTimeout(function(){
            if(timerRunning){
                $('#console').text(window.performance.now() - startTime + totalTime);
                timerLoop();
            }
        }, 50);
    }

    timerLoop();    
}

$('#btn').on('click', function(){
    startTimer();
});

$('#btn2').on('click', function(){
    totalTime = window.performance.now() - startTime + totalTime;
    $('#console').data('totalTime', totalTime);
    timerRunning = false;
});

我接受了你的代码，我做的第一件事是修复在if语句的单独行上有关花括号的语法方面的错误，在if语句中缺少分号，当运行状态为0时，一个分号错误放在timecounter（）调用。您尝试通过使其成为字符串来调用函数，但字符串从不调用函数。在将它作为参数传递给timecounter（）之前，未定义starttime。你的settimeout（）行应该在condition语句之外设置来调用它。如果运行状态不是1，则不必要地调用else。除了使其为空字符串之外，未定义lapdate。除非运行状态为1，否则不定义刷新，但仅在刷新不等于1时调用。最后，您没有包含所有必要的代码，以了解是否还有其他错误，也没有足够的代码来知道我是否重写了将解决您的问题，这就是我编写新代码的原因（它需要将jquery库包含在您的页面中）。我真的不明白你的代码的逻辑。还有一件事：您需要在用户启动计时器，单击暂停，然后恢复计时器后检索已存储时间的存储值。非常感谢，你应该去JSLint.com或类似的，并且永远不要在浏览器中运行你的代码，直到它通过lint测试。我只是在底部重新发布您的代码，不要指望它能够正常工作。我在vanilla javascript中重新计算我的计时器，不需要jquery。它在这里：

工作并且不需要jQuery：

<!DOCTYPE html>
<html>
<head> 
</head>
<body>

    <div id="console"></div>
    <input type="button" id="btn" value="start time" onclick="startTimer();">
    <input type="button" id="btn2" value="stop time" onclick="stopTimer();">
    <input type="hidden" id="storedTime" value="0">

<script>
    var timerRunning = false;
    var startTime;
    var totalTime;
    var storedTimeInp = document.getElementById('storedTime');
    var console = document.getElementById('console');

    function startTimer(){
        totalTime = Number(storedTimeInp.value, 10);
        startTime = window.performance.now();
        timerRunning = true;

        function timerLoop(){
            window.setTimeout(function(){
                if(timerRunning){
                    console.innerHTML = (window.performance.now() - startTime + totalTime);
                    timerLoop();
                }
            }, 50);
        }

        timerLoop();    
    }    

    function stopTimer(){
        totalTime = window.performance.now() - startTime + totalTime;
        storedTimeInp.value = totalTime;
        timerRunning = false;
    }   


</script>
</body>
</html>

您的代码重写有点（已损坏）：

var runningstate = 0;

function timecounter(starttime){
  currentdate = new Date();
  details = document.getElementById('details');
  stopwatch = document.getElementById('stopwatch');

  var timediff = currentdate.getTime() - starttime;

  setTimeout(
    if(runningstate == 0){
      timediff = timediff + stoptime;
    }else{
      stopwatch.value = formattedtime(timediff);
      timecounter(starttime);
      stoptime = timediff;
    }  
  ,10);
}

function startandstop(){
  var startandstop = document.getElementById('startandstopbutton');
  if(runningstate==0){
    startandstop.value = 'Pause';
    runningstate = 1;
    starttime = new Date();
    starttime = starttime.getTime();
    timecounter(starttime);
  }else{
    startandstop.value = 'Start';
    runningstate = 0;
    lapdate = '';
  }
}

暂停秒表不会停止时间

1 个答案: