每按一次按钮重置setTimeout？

Question

这是我的代码:

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

它设置setTimeout为10秒.我希望有一个重置按钮,单击,setTimeout再次拨打10秒延迟.

Answer 1

您可以通过将setTimeout()调用的结果存储到某个变量,然后在clearTimeout()单击按钮时将存储的结果传递给调度新的超时并将其分配回同一个变量来执行此操作.

听起来有点棘手,但它真的很简单.这是一个例子:

http://jsfiddle.net/kzDdq/

Answer 2

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代码应放在ready处理程序中.

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

(您可以将延迟设置为较小的值,如3000(3秒) - 这样可以更轻松地测试演示.)