Question

我正在使用jQuery插件将倒数计时器放在我的网页中。目前，控制计时器显示内容的代码是：

<script type="text/javascript">
    var clock = $('.clock').FlipClock(3600 * 24 * 3, {
        clockFace: 'DailyCounter',
        countdown: true
    });
</script>

可以在此处查看插件的JS：https://github.com/objectivehtml/FlipClock/blob/master/js/flipclock/flipclock.js

可以在此处看到正在使用的代码的示例页面： http://flipclockjs.com/faces/daily-counter

目前，计时器是3天的倒计时，每次刷新页面时都会重置。我想使用倒数计时器的自定义时间，这将是绝对的（不会通过页面刷新重置）。我希望日期是2013年9月30日太平洋标准时间中午12:00（美国西部 - 加利福尼亚时区）。

无论如何使用Javascript或jQuery做到这一点？

Answer 1

获取当前时间，并注意这将是用户计算机时钟上设置的时间，无论设置为何，设置特定日期，然后计算差异并将其用于插件：

var date  = new Date(Date.UTC(2013, 8, 30, 12, 0, 0));
var now   = new Date();
var diff  = date.getTime()/1000 - now.getTime()/1000;

var clock = $('.clock').FlipClock(diff, {
    clockFace: 'DailyCounter',
    countdown: true
});

对于准确的时间，我会使用您的网络服务器重新输出当前时间。

Answer 2

我这样做：

<script type="text/javascript">
    var clock = $('.clock').FlipClock(new Date(2013,8,30).getTime()/1000 - new Date().getTime()/1000, {
        clockFace: 'DailyCounter',
        countdown: true
    });
</script>

这倒数到2013年9月30日......我还没试过，所以我不确定它是否有效。

编辑：将日期更正为新日期（2013,8,30）而不是新日期（2013,9,30），因为月份从0开始计算而不是1。

Answer 3

我正在假设.FlipClip（）的第一个arg是倒计时完成之前的时间量。这一次，“t”应该是现在和目标时间之间的差异。

var t = targetTimeInMs - currentTimeInMs;

要获取当前时间，请使用no-arg Date构造函数。

var currentTimeInMs = new Date().getTime();

要获取目标时间，请使用参数提供日期。以下是MDN的一些示例：

var today = new Date();
var birthday = new Date("December 17, 1995 03:24:00");
var birthday = new Date(1995,11,17);
var birthday = new Date(1995,11,17,3,24,0);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

我不确定你是否需要提供毫秒作为.FlipClip（）函数的第一个arg。请参阅文档/来源。然后使用Date对象的适当方法获取所需的单位（秒？分钟？小时？并使用date.getSeconds（），getHours（）等，请参阅MDN。）

特定时间和日期的Javascript倒计时

3 个答案: