实现一个简易的秒表计时器,要求点击开始按钮进行计时,点击停止按钮暂停即使,再次点击开始按钮会继续计时。
最近面试第二次遇到这个题了,第一次是快手的一面面试题,当时面试官让我用 Vue 写,磕磕绊绊写出来了,面试完也没想仔细看看代码优化一下,结果今天招商银行的笔试又遇到这道题了,所以决定好好整理一下。
<input id="counter" type="text" readonly>
<button onclick="start()">开始</button>
<button onclick="stop()">停止</button>
<script>
let step = 0;
let intervalId = null;
function count() {
document.getElementById('counter').value = step;
step = step + 1;
}
function start() {
if (intervalId===null) { //没有定时器时再执行
count();
intervalId = setInterval(count, 1000);
}
}
function stop() {
clearInterval(intervalId);
intervalId = null; //clearInterval之后需要将intervalId=null
}
</script>