5

我正在使用 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来做到这一点？

4

3 回答 3

15

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

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
});

为了获得准确的时间，我建议您使用您的网络服务器来输出当前时间。

于 2013-08-25T22:08:17.697 回答
9

我会这样做：

<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 开始。

于 2013-08-25T22:12:40.030 回答
0

我假设 .FlipClip() 的第一个参数是倒计时完成之前的时间量。这个时间，“t”，应该是现在和目标时间之间的差。

var t = targetTimeInMs - currentTimeInMs;

要获取当前时间，请使用无参数 Date 构造函数。

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

要获取目标时间，请为 Date 提供参数。以下是来自 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() 函数提供毫秒作为第一个参数。请参阅文档/来源。然后使用 Date 对象的适当方法来获取所需的单位（秒？分钟？小时？并使用 date.getSeconds()、getHours() 等，参见 MDN。）

于 2013-08-25T22:18:56.380 回答