Question

我想要的是当计时器到达结束日期和时间时它会自动重新开始，但是从60秒开始倒计时。我是jquery的新手，我和这个问题串联了将近3天，我无法让它运行。我的倒计时与从数据库插入的最终数据完美配合，但是当它到达结束日期和时间时（例如：0天0小时0分0秒），它应该从60秒倒计时到零开始。

有人可以帮忙解决这个问题吗？下面是我使用的代码的和平。我将它与PHP结合使用，因此它也会创建用于倒计时的div。

JQUERY：

$data = '<script type="text/javascript">
$(function () {';
    foreach( $datarows as $key => $value ) { // start php foreach

    $data .= '
              $(\'#wincountdown'.$datarows[$key]['uid'].'\').countdown({ until: new Date( '. strftime( '%Y,%m - 1,%d,%H,%M',$datarows[$key]['end_bidding']).' ) }) ;
    ';
    } // end php foreach
$data .= '
});
</script>';

HTML

<div id="wincountdown<#nr#>">  </div> //build by db array

所以上面的代码片段工作正常。现在它只应在达到结束日期时自动重启。所以我的问题是我如何实现这段代码来实现我想要的东西，或者我应该使用和添加jquery的哪些函数？也许有人得到了一段代码，这些代码已经完成并且想要分享它？

有人可以帮帮我吗？如果我不够清楚，请让我解释得更好。

提前致谢。

Answer 1

使用JQuery Countdown插件。

它具有可在计时器达到零时触发的回调事件。发生这种情况时，只需重置和计时器。

假设这是我们的html：

<div id="shortly"></div>
<button id="shortlyStart">Start</button>

这大致是你需要重置倒数计时器的JQuery。

// restart the timer on expiry
$('#shortly').countdown({until: shortly,  
    onExpiry: restart, onTick: watchCountdown}); 

$('#shortlyStart').click(function() { 
    // restart the timer on click
    restart();
}); 

function restart() { 
    shortly = new Date(); 
    shortly.setSeconds(shortly.getSeconds() + 5.5); 
    $('#shortly').countdown('change', {until: shortly}); 
} 

// show the timer results 
function watchCountdown(periods) { 
    $('#monitor').text('Just ' + periods[5] + ' minutes and ' + 
        periods[6] + ' seconds to go'); 
}

Answer 2

我再次研究了你的上面的代码（这次更好一点）......当达到零时我的重启工作正常！ Yeaaahhh。必须调整代码中的其他一些东西，但我的主要目标已经实现...非常感谢，这真的帮助我更好地理解jquery。基本上很简单，但首先要基本了解:)

非常感谢！

自动重启/重置倒数计时器

2 个答案: