javascript - 如何从 setInterval() 函数中获取剩余时间

Question

我有以下代码

function startTimer(time) {
  var countDown = 0;
  var time1 = time * 60;
  x = setInterval(function() {
    time2 = time1--;
    if (time2 > 0) {
      document.getElementById("displayTime").innerHTML = time2;
    } else if (time2 == 0) {
      clearInterval(x);
    }
  }, 1000);
}
startTimer(30)

<span id=displayTime></span>

我怎样才能从这段代码中获得剩余时间并将它们用于暂停/恢复目的。 (我打算将该值应用到函数中)。

我尝试为暂停和恢复创建 2 个按钮，但不起作用。

 $("#start").on("click",function(){
   if (time2 < setTime){
     startTimer(time2);
   }
   else{
     startTimer(setTime);
   }

   });
   $("#stop").on("click",function(){
     clearInterval(x);
    })
    });

Answer 1

我从函数中取出了 time2，并在函数之外使 x 可用。我们可以用它来启动/恢复计时器。

var time2;
var timer;
function startTimer(time) {
  var countDown = 0;
  var time1 = time * 60;
  x = setInterval(function() {
    time2 = time1--;
    if (time2 > 0) {
      document.getElementById("displayTime").innerHTML = time2;
    } else if (time2 == 0) {
      clearInterval(x);
    }
  }, 1000);
  return x;
}

function pauseTimer() {
  clearInterval(timer);
}
function resumeTimer() {
  time = time2/60 || 30;
  timer = startTimer(time);
}

<span id=displayTime></span>
<button onclick="pauseTimer()">Pause</button>
<button onclick="resumeTimer()">Start/Resume</button>