Flipclock js倒计时1小时不复位

时间:2015-07-28 08:22:55

标签: javascript jquery countdown flipclock

我试图在不重置刷新时间的情况下进行倒计时。我只需要倒计时1h,但我不希望它在刷新时重置。从服务器获取当前时间和到期时间不起作用,因为我想在点击时重置该计时器。这是我目前的js代码:

<script>
    var clock;


    clock = $('.clock').FlipClock({
        clockFace: 'HourlyCounter',
        autoStart: false,
        callbacks: {
            stop: function() {
                $('.message').html('The clock has stopped!')
            },
        }
    });   
    clock.setTime(3600);
    clock.setCountdown(true);
</script>

1 个答案:

答案 0 :(得分:3)

是的,您可以根据您的示例使用 flipclock jquery-cookie 来查看 1 minute countdown Example

init() flipclock函数clock.setTime()将结束日期存储在Cookie中,使用clock.setCountdown(true)初始化计时器,使用clock.start()启用倒计时,然后按var counter = $.cookie('endDate')-currentDate; clock.setTime(counter); 启动。

现在,如果用户刷新页面,我们将Timer设置为当前日期和结束日期之间的差异,因此这个计数器可以正常继续倒计时:

reset

点击endDate按钮将重置计数器,方法是删除Cookie <div class="clock" style="margin:2em;"></div> <div class="message"></div> <button id='reset'>Reset</button> 并初始化倒计时功能。

HTML:

//ready function
$(function(){

    countDown = function(){
        var currentDate = Math.round(new Date() / 1000);

        var clock = $('.clock').FlipClock({
            countdown: true,
            callbacks: {
                init: function() {
                    //store end date If it's not yet in cookies
                    if(!$.cookie('endDate')){
                        // end date = current date + 1 minutes
                        var endDate = Date.now() + 1*60*1000; 

                        // store end date in cookies
                        $.cookie('endDate', Math.round(endDate / 1000)); 
                    }
                },
                stop: function() {
                    $('.message').html('The clock has stopped!');
                },
            }
        });

        /* counter will be at first 1 min if the user refresh the page the counter will 
           be the difference between current and end Date, so like this counter can 
           continue the countdown normally in case of refresh. */
        var counter = $.cookie('endDate')-currentDate;

        clock.setTime(counter);
        clock.setCountdown(true);

        clock.start();
    }

    //reset button
    $('#reset').click(function(){
        $.removeCookie('endDate'); //removing end date from cookies
        countDown(); //launch countdown function
    });

    //Lanching count down on ready
    countDown();
});

Js:

var endDate = Date.now() + 1*60*1000; // For you .... + 60*60*1000

在你的情况下(1小时)你只需要在这一行中替换1乘以60:

private void Method(int number, int number2) {
   if (number3 == 0) throw new Exception("number3 is zero, resulting in division by zero");
   if (number2 + number == 0) throw new Exception("number2 + number is zero");
   number 4 = (number2 + number) / number3
}