Question

我写了一个javascript应用程序，但最终我感到很困惑。这个js应用程序需要在几分钟，几秒和几百秒内运行。关于这个混乱的部分是秒表显示，在这种情况下03：196：03。这是我的困惑。当秒表显示196时，是否显示百分之一秒？有没有人可以查看我的功能并告诉我在功能错误的情况下需要纠正哪些部分？

<html>
<head>
    <title>my example</title>
    <script type="text/javascript">
            //Stopwatch
    var time = 0;
    var started;
    var run = 0;
    function startWatch() {
        if (run == 0) {
            run = 1;
            timeIncrement();
            document.getElementById("countDown").disabled = true;
            document.getElementById("resetCountDown").disabled = true;
            document.getElementById("start").innerHTML = "Stop";
        } else {
            run = 0;
            document.getElementById("start").innerHTML = "Resume";
        }
    }//End function startWatch
    function watchReset() {
        run = 0;
        time = 0;
        document.getElementById("start").innerHTML = "Start";
        document.getElementById("output").innerHTML = "00:00:00";
        document.getElementById("countDown").disabled = false;
        document.getElementById("resetCountDown").disabled = false;
    }//End function watchReset
    function timeIncrement() {
        if (run == 1) {
            setTimeout(function () {
                time++;
                var min = Math.floor(time/10/60);
                var sec = Math.floor(time/10);
                var tenth = time % 10;

                if (min < 10) {
                    min = "0" + min;
                }
                if (sec <10) {
                    sec = "0" + sec;
                } else if (sec>59) {
                    var sec;
                }
                document.getElementById("output").innerHTML = min + ":" + sec + ":0" + tenth;
                timeIncrement();
            },10);
        }
    } // end function timeIncrem
    function formatNumber(n){
        return n > 9 ? "" + n: "0" + n;
    }


    </script>
</head>
<body>
    <h1>Stopwatch</h1>
    <p id="output"></p>
    <div id="controls">
        <button type="button" id ="start" onclick="startWatch();">Start</button>
        <button type="button" id ="reset" onclick="watchReset();">Reset</button>
    </div>
</body>
</html>

Answer 1

你的代码非常奇怪！

首先，您使用document.getElementById()表示不存在的元素：可能它们属于您的原始代码，而您没有将其发布完整。

然后我不明白你的计时方法：

你让timeIncrement()每10毫秒发布一次：所以time/10会给你一些毫秒数
但您计算min和sec就好像是几秒钟一样！

从那里，一切都错了......

无论如何，IMO你可以使用getMilliseconds()对象的Date函数更简单。

Answer 2

试试这个：

document.getElementById("output").innerHTML = [
  Math.floor(time/100/60 % 60),
  Math.floor(time/100 % 60),
  time % 100
].map(formatNumber).join(':')

＆＃13;

var time = 0;
var started;
var run = 0;
function startWatch() {
  if (run == 0) {
    run = 1;
    timeIncrement();
  } else {
    run = 0;
  }
}
function watchReset() {
  run = 0;
  time = 0;
  document.getElementById("output").innerHTML = "00:00:00";
}
function timeIncrement() {
  if (run == 1) {
    setTimeout(function () {
      time++;
      document.getElementById("output").innerHTML = [
        Math.floor(time/100/60 % 60),
        Math.floor(time/100 % 60),
        time % 100
      ].map(formatNumber).join(':')
      timeIncrement();
    },10);
  }
}
function formatNumber(n){
  return (n < 10 ? "0" : "") + n;
}
startWatch()

＆＃13;

<div id="output"></div>

＆＃13;

JS功能秒表应用程序使用户感到困惑

2 个答案: