javascript - 每次单击按钮时重置 setTimeout？

Question

这是我的代码:

var sec = 10; 
var timer = setInterval(function() {    
    $('#timer span').text(sec--); 
}, 1000);

它将 setTimeout 设置为 10 秒。我想要一个重置按钮，单击该按钮会延迟 10 秒再次调用 setTimeout。

Answer 1

HTML:

<button id="resetButton">Reset</button>

JavaScript:

var resetButton = $('#resetButton')[0],
    timerId;

function timerExpired() {
    alert('Timer expired');
}

$(resetButton).click(function() {
    clearTimeout(timerId);
    timerId = setTimeout(timerExpired, 10000);
}).triggerHandler('click');

注意:此 JavaScript 代码应放在 a ready handler 内.

现场演示: http://jsfiddle.net/QkzNj/

(您可以将延迟设置为较小的值，如 3000(3 秒)- 这将使测试演示更容易。)