如何获取从特定日期/时间开始并每小时倒数的倒数计时器 [英] How to get a countdown timer that starts on a specific date/time and counts down every hour
问题描述
我正在尝试实现一个倒计时计时器，该计时器将使用一个特定的日期和时间来开始计时.从那里开始，我需要从1小时开始倒数，然后通过添加一个小时来更新初始日期和时间，然后无限期地重复自身.
I'm trying to achieve a countdown timer that would use a specific date and time for it to start. From there I need it to countdown from 1 hour and then update the initial date and time by adding an hour and then repeat itself indefinitely.
这用于产品拍卖，一旦一个新产品售罄，它就会获得新产品，并且从添加到拍卖中开始，价格可能会在一天中的任何时间下降每小时.
This is used for a product auction that would get a new product once one sells out and the price drops every hour from when it is added to the auction which could be any time of day.
示例:
我需要此计时器从2014年7月25日11月30日0、0(8月25日，2014年美国东部标准时间上午11:30)将倒计时1小时，并在完成后倒计时将使开始日期增加一个小时，使2014、7、25、12、30、0，0这将无限期地重复，直到我选择停止它为止.
I need this timer to start on 2014, 7, 25, 11, 30, 0, 0 (August 25th, 2014 at 11:30 AM EST) It would countdown 1 hour and upon completion it would add on an hour to the start date making 2014, 7, 25, 12, 30, 0, 0 This would repeat itself indefinitely until I choose to stop it.
基于站点访问者是否刷新页面，这也不会改变，这意味着他们访问页面并看到还剩33分钟，而不是每次刷新都将其重置为1小时.
It would also not change based on if the site visitor refreshed the page, meaning they visit the page and see 33 minutes left, not keep resetting it to 1 hour for each refresh.
我要使用此倒数计时器: http://keith-wood.name/countdown.html
I was going to use this countdown timer: http://keith-wood.name/countdown.html
我需要的是我以可变形式给它的时间.我试图在没有任何运气的情况下尽可能地对此进行研究，大多数还不够具体，或者只处理日期而不是时间.
What I needed was the time that I give it in variable form. I tried to research this as much as possible without any luck, most are not specific enough or only deal with the date and not the time.
我不太精通Javascript和jQuery；这是我到目前为止的情况.
I'm not that well versed in Javascript and jQuery; here is what I had so far.
请原谅我的代码，这里有很多想法在起作用:
Pardon my code, there are many ideas at work here:
$(document).ready(function() {
var everyhour = new Date();
//everyhour = new Date(everyhour.getFullYear() + 1, 1 - 1, 1);
everyhour = 2014, 8-1, 25, 9, 30, 0, 0;
// the above was my initial try and it wasn't getting me anywhere
var date = new Date(2014, 7, 25, 12, 0, 0);
var now = new Date();
var diff = date.getTime()/1000 - now.getTime()/1000;
alert (diff);
// The above was another stab at it, got me a little closer
var minutesToAdd = 60;
date.setMinutes(date.getMinutes()+minutesToAdd);
// the above was something I found on this website and got brain block
// the below was me trying to start a loop and get the date to update by adding an hour onto it
// for i
// if diff = 3600 {
// var dated = dated + 1
// }
$('#auctioncountdown').countdown({until: diff, format: 'HMS'});
});
任何帮助将不胜感激.
推荐答案
我最终做了一些简单的事情，最终实现了我最初的要求，即使用现在"而不是特定的日期.计时器每小时重置一次，并刷新页面以更改内容.就我而言，我实际上要花几分钟时间，因为后台应用程序需要一两分钟来完成它，以便用新信息更新服务器.基本上是要摆脱滞后时间，并为页面访问者提供更好的用户体验.
I ended up going with something simpler and ultimately achieving what I was originally asking, using 'now' instead of a specific date. Having a timer reset itself every hour and refreshing the page to changed content. In my case I'm actually adding a couple of minutes to the time because of a background app taking a minute or two to do it's communication on updating the server with new information. It's basically to get rid of the lag time and make a better user experience for the page visitor.
这是我的代码:
$(document).ready(function() {
function ShowTime() {
var now = new Date();
var diff = -2;
var nowTwo = new Date(now.getTime() + diff*60000);
var mins = 59-nowTwo.getMinutes();
var secs = 59-nowTwo.getSeconds();
timeLeft = "" +mins+'m '+secs+'s';
$("#auctioncountdown").html(timeLeft);
if ($("#auctioncountdown").html() === "0m 1s") {
location.reload(true)
};
};
function StopTime() {
clearInterval(countdown);
}
ShowTime();
var countdown = setInterval(ShowTime ,1000);
});
这篇关于如何获取从特定日期/时间开始并每小时倒数的倒数计时器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
