如何將控件添加到JavaScript定時器

Question

如何向以下JavaScript計數定時器添加「暫停」，「恢復」，「重置」和「結束」功能？

var sec = 0; 

function pad(val) { 
    return val > 9 ? val : "0" + val; 
} 
setInterval(function() { 
    document.getElementById("seconds").innerHTML = pad(++sec % 60); 
    document.getElementById("minutes").innerHTML = pad(parseInt(sec/60, 10)); 
}, 1000); 

Answer 1

你需要有指針setInterval功能爲：

var sec = 0, 
    timeoutHandler; 

function pad(val) { 
    return val > 9 ? val : "0" + val; 
} 

function pausePad() { 
    clearTimeout(timeoutHandler); 
} 

function resumePad() { 
    pausePad(); 
    runPad(); 
} 

function resetPad() { 
    sec = 0; 
    resumePad(); 
} 

function runPad() { 
    timeoutHandler = setInterval(function() { 
     document.getElementById("seconds").innerHTML = pad(++sec % 60); 
     document.getElementById("minutes").innerHTML = pad(parseInt(sec/60, 10)); 
    }, 1000); 
} 
runPad();