Question

需要一个从03：00,02：59开始的倒数计时器......一旦到达0:00，计时器应自动重置为03:00，这个逻辑应该是无限的。假设Noone应该对这个逻辑有任何控制权来阻止它。

我浏览并浏览了一段javascript代码。仅使用Javascript功能，如果最终用户触发器的浏览器刷新，则计数器重置为3:00。这不应该发生。

所以我使用JS，Jquery，PHP，Mysql，希望我能通过保持数据库中的开始时间，结束时间，Intreval持续时间来找到解决方案（很抱歉没有详细说明，但我假设这是一个常见的用例，人们可以理解我在这里面临的问题）。

我仍在寻找解决方案。请帮助我解决这个问题。

顺便说一下，一旦计时器到达倒数计时器的0:00工作，我不会查找Countdowntimer问题的答案。我有它的想法。

Answer 1

您可以通过这种方式创建计时器 -

// 15 days from now!
var date = new Date(new Date().valueOf() + 15 * 24 * 60 * 60 * 1000);
$('#clock').countdown(date, function(event)
{
    $(this).html(event.strftime('%D days %H:%M:%S'));
});

  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css">
<link rel="stylesheet" href="//yui.yahooapis.com/pure/0.4.2/pure-min.css">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Source+Sans+Pro:300,600,300italic">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Oswald">
<link rel="stylesheet" href="http://hilios.github.io/jQuery.countdown/css/syntax.css">
<link rel="stylesheet" href="http://hilios.github.io/jQuery.countdown/css/main.css">
<script src="//code.jquery.com/jquery.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
<script src="//cdn.rawgit.com/hilios/jQuery.countdown/2.1.0/dist/jquery.countdown.min.js"></script>

<div class="example-base">
  Limited Time Only!
  <span id="clock"></span>
</div>

现在你需要做的是将它与PHP集成。

加载页面时，你必须set timeouts获取JS代码。

那么，那么JS代码就是这样 -

setTimeout( function()
{
    //JS code for timer 
    var date = new Date(new Date().valueOf() + 15 * 24 * 60 * 60 * 1000);
    $('#clock').countdown(date, function(event)
    {
        $(this).html(event.strftime('%D days %H:%M:%S'));
    });
}  , 1000 );

这里的时间设置为1秒，但在你的情况下，时间应该来自服务器，所以你应该做的就是在PHP中这样做以获得秒数 -

$timeCurrent  = strtotime('now');
$timeFutre = strtotime(date("Y-m-d").' 03:00:00');
$differenceInSeconds = $timeSecond - $timeFirst;

现在你应该在JS中使用它。

你可以使用AJAX并设置剩余时间，也可以像这样使用PHP echo -

setTimeout( function()
{
    //JS code for timer 
    var date = new Date(new Date().valueOf() + 15 * 24 * 60 * 60 * 1000);
    $('#clock').countdown(date, function(event)
    {
        $(this).html(event.strftime('%D days %H:%M:%S'));
    });
}  , 1000* <?php
                $timeCurrent  = strtotime('now');
                $timeFutre = strtotime(date("Y-m-d").' 03:00:00');
                $differenceInSeconds = $timeSecond - $timeFirst;
                echo $differenceInSeconds; 
           ?> );

认为你有完整的答案。

倒数计时器：需要计时器在无限次达到0分钟后从3点自动启动

1 个答案: