這裏是一個簡單的倒數計時器,從9到0計數。 倒計時工作正常。但是如果我想暫停它,然後從暫停的位置重新啓動,該怎麼辦? 我試過了(見下面的代碼)來中斷倒計時,保存它所在的號碼,然後從新號碼重新啓動該功能。但是倒數計時很糟糕,我看不出爲什麼。有任何想法嗎?JS倒數計時器 - 暫停功能
PS。我可以從其他地方剪切和粘貼計時器,但是我正在爲了學習體驗而做這個。我相信有更好的方法來編寫JS中的倒數計時器,但是這讓我感到困惑,我無法使這種方式工作,並認爲我必須失去明顯的東西。
非常感謝
var currentTimeInt = 10;
var minn = [];
var stop = 0;
// stop
function stopCounter() {
currentTime = document.getElementById('mins').textContent; // grabs the number of minutes at moment of pause.
stop = 1;
}
// restart
function restart() {
stop = 0;
currentTimeInt = parseInt(currentTime, 10); // converts that number into an integer we can use
document.getElementById("mins").innerHTML=currentTimeInt;
newMinutes(); // restarts the newMinutes function with the start time currentTimeInt set to the time the counter stopped at
}
function newMinutes() {
document.getElementById('mins').innerHTML= currentTimeInt; // displays the counter
for (aa = currentTimeInt-1; aa >= 0; aa--) {
minn.push(aa); // builds an array of numbers in descending order
document.getElementById('mins').innerHTML= minn[aa];
for (let bb=1; bb<=currentTimeInt; bb++) {
if (bb<currentTimeInt) {
setTimeout(function timer(){
\t if (stop == 0) { // checks if "stop!" has been clicked and returns false to stop the function if that is the case
document.getElementById('mins').innerHTML= minn[bb];
\t \t console.log(minn[bb]);
\t }
\t else {return false;}
\t \t }, bb*1000);
\t }
} \t
}
console.log(currentTimeInt + " the end");
}
<span>Minutes: </span><span id= "mins"></span>
<button onclick="newMinutes()">Go!</button>
<button onclick="stopCounter()">Stop!</button>
<button onclick="restart()">Reset!</button>
這是一個很好的機會去學習對象和對象方法的基本知識。使用它們可以使任務更簡單,並且您可以使用可重用的代碼。 – Teemu
按照降序構建數組後,您的想法如何? –
@Teemu好的,我現在要讀一讀。謝謝你的提示。 –