用 js 写的计时器，暂停计时无法生效

Question

是用setInterval每10ms调用一次倒计时方法，想让计时器在倒计时的时候点击停止能暂停，再点能继续

                var FnSec=function(){
                    sec.innerHTML-=1;
                    if(sec.innerHTML<0){
                        sec.innerHTML="100";
                        time.innerHTML-=1;
                    }
                    if(time.innerHTML.length<2){
                        time.innerHTML="0"+time.innerHTML;
                    }
                    if(sec.innerHTML.length<2){
                        sec.innerHTML="0"+sec.innerHTML;
                    }
                    if (sec.innerHTML==0 && time.innerHTML==0) {
                        clearInterval(secInterValId);
                        var audio = document.getElementById("bgMusic");
                        audio.play();
                        window.alert("时间到！");
                        audio.pause();
                        start.innerHTML="开始";
                        inputDisable.style.display="none";
                        input.style.display="block";
                        resetDisable.style.display="block";
                        reset.style.display="none";
                        time.innerHTML="10";
                        sec.innerHTML="00";
                    }
                }
                var secInterValId=setInterval(FnSec,10);
                start.innerHTML="停止";

刚学前端，今天刚学了间歇调用，小白捣鼓了一晚上都不行，没辙了，求大神帮忙看一下！！

Answer 1

secInterValId 改成全局变量，使得可以保存上一次的 setInterval 值。否则每次点击同一个按钮 secInterValId 都将被重置

以下伪代码仅供参考

(function () {
  var secInterValId = null

  startBtn.addEventListener('click', () => {
    secInterValId = setInterval(fn, 10)
  })

  pauseBtn.addEventListener('click', () => {
    clearIntervalId(secInterValId)
  })
}())

Answer 2

我给个另外的思路，直接加个状态变量进行控制就行了，比如说：

var paused = false,
    timer = null;
function loop(){
    timer = setTimeout(loop,10);
    if(paused) return false;
    //这里主代码
}

//当你需要暂停的时候，改变paused的值就行了,这当你在一个计时器下，需要分开管理不同功能的状态的时候很有用。如果确实需要销毁计时器，再clear(timer)变量就行