jQuery Countdown-每日倒数，还有二级倒数？ [英] jQuery Countdown - Daily Countdown, with secondary countdown as well?

问题描述

我正在尝试使用Keith Wood的jQuery倒数插件（http://keith-wood.name/countdownRef.html）来创建一个页面，每日倒数。例如：

I'm trying to use Keith Wood's jQuery countdown plugin (http://keith-wood.name/countdownRef.html) in order to create a page of daily countdowns. E.g.:

• A-倒数到每天07:00


• B-倒数到每天09:00


• C-倒计时至每天11:00

I

var foo = new Date();
foo.setHours(11)
foo.setMinutes(0)
foo.setSeconds(0)
$('#fooCountdown').countdown({until: foo});

基本上，我只是创建一个默认为现在的新Date对象，然后将时间设置为时间我今天要。

Basically, I just create a new Date object which defaults to now, then set the time to the time I want for today.

但是，这很hacky，而且一天结束时也不会重置-一旦新的一天过去了，它仍然倒计时到前一天的时间。

However, this is pretty hacky, and also it doesn't reset at the end of the day - once the new day ticks over, it's still counting down to the time on the previous day.

有没有更清洁或更完善的方法使用此插件进行每日倒计时？

Is there a cleaner or better way of doing daily countdowns with this plugin?

第二个-我也希望每次倒数计时到期时都倒数到当天的第二个时间。

Secondly - I also want each countdown, when it expires, to count down to a second later time that day.

例如对于A-到达07:00时，它将开始倒数至当天的15:00。

E.g. for A - once it reaches 07:00, it then starts counting down to 15:00 for that day.

我正在使用onExpiry函数进行此操作：

I'm doing this using the onExpiry function:

$('#officeCountdown').countdown({until: officeOpens, onExpiry: OfficeOpen, alwaysExpire: true});

...

function OfficeOpen() {
    $('#officeCountdown').countdown('option', {until: officeCloses, onExpiry: OfficeClose, alwaysExpire: true});
}

function OfficeClose() {
    alert('Office has closed')
}

第一部分-递减计数直到officeOpen正常工作。

The first part - counting down down until officeOpen seems to work.

但是，第二部分-递减计数直到OfficeClose不再执行-似乎总是开始计算officeOpens和officeCloses之间的差，而不是使用当前时间-而且，OfficeCLose函数似乎从未触发过。

However, the second part - counting down until OfficeClose doesn't - it seems to always start counting down the difference between officeOpens and officeCloses, instead of using the current time - and also, the function OfficeCLose never seems to trigger.

有什么想法吗？

推荐答案

我建议您使用出色的 Datejs 插件，用于创建/处理日期。

（请阅读入门和文档，因为它确实很广泛）

I would suggest you use the excellent Datejs plugin for creating/handling dates.
(read the getting-started and the docs because it is really extensive)

这种方式您可以做到

$('#fooCountdownA').countdown({
    until: Date.today.set({hour:7}) 
});
$('#fooCountdownB').countdown({
    until: Date.today.set({hour:9}) 
});
$('#fooCountdownC').countdown({
    until: Date.today.set({hour:11}) 
});

---

至于倒计时，插件似乎没有以便于重复使用倒计时。
也许您最好创建虚拟元素并将其插入dom中以保持倒数，并在到期时销毁它们。.

---

As for the countdown, the plugin does not seem to be friendly to re-using countdowns.. Perhaps you are better off creating dummy elements and inserting them in the dom to hold the countdown, and destroying them on expiry..

这篇关于jQuery Countdown-每日倒数，还有二级倒数？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！