Question

您好我正在进行一项反应测试，该测试会检查用户在做出反应之前需要多快的速度，而且我无法真正找到我正在寻找的内容。我只是想知道如何在几秒和几毫秒内制作一个简单的秒表，以便稍后在HTML onclick中调用该函数。

到目前为止，这是我的代码：

HTML

<input type="button" class="first" value="Call" onclick="call function" />

这就是它......我知道HTML，CSS，JavaScript和一点点jQuery。

提前致谢！

Answer 1

作为一个基本的起点，您希望使用setInterval来增加秒表，并使用其他功能来切换/重置秒表。

然后你可以将点击处理程序直接绑定到按钮（下面是），或者 - 我倾向于建议你在Javascript本身绑定它（例如用.onclick=function(){....}）

var s = 0,
  ms = 0,
  sEl = document.getElementById('s'),
  msEl = document.getElementById('ms'),
  play = false;
stopwatch = setInterval(function() {
  if (!play) return;
  if (ms === 99) {
    s += 1;
    ms = 0;
  } else {
    ms += 1;
  }
  update();

}, 1);

function update() {

  sEl.innerText = s;
  msEl.innerText = ms;
}

function toggle() {
  if (!play) {
    s = 0, ms = 0;
    update();
  }
  play = !play;
}

body {
  font-family: arial;
}
#s {
  font-size: 50px;
}
#ms {
  font-size: 30px;
  display:inline-block;
  width:35px;
}
button {
  border: 1px solid grey;
  background: lightgrey;
  padding: 10px 40px;
}

<span id="s">0</span>s <span id="ms">00</span>ms
<br />
<button onclick="toggle();">Toggle</button>

秒表以秒和毫秒为单位

1 个答案: