Javascript Countdown
我正在尝试创建一个倒计时。 基本上我有时间客户已经下了一个订单(这是在日期时间格式存储在数据库为例如“2014-08-14 12:52:09”),我也有时间完成订单(这是在几小时和几分钟“1”45“,或只是几分钟”45“)Javascript Countdown
我从网上倒计时的脚本,我有一个糟糕的时间搞清楚如何格式化两次,以便脚本理解
我得到这个从DB 订购时间----> 12时52分09秒 到期时间--->45分钟
到期时间有时可能包括时间,以及未来: 例如:到期时间---> 1小时45分钟。
剧本我从我包围的函数内部此刻的网站得到:
JS:
function clockTicking(){
// set the date we're counting down to
var target_date = new Date("Aug 15, 2019").getTime();
// variables for time units
var days, hours, minutes, seconds;
// get tag element
// update the tag with id "countdown" every 1 second
setInterval(function() {
// find the amount of "seconds" between now and target
var current_date = new Date().getTime();
var seconds_left = (target_date - current_date)/1000;
// do some time calculations
days = parseInt(seconds_left/86400);
seconds_left = seconds_left % 86400;
hours = parseInt(seconds_left/3600);
seconds_left = seconds_left % 3600;
minutes = parseInt(seconds_left/60);
seconds = parseInt(seconds_left % 60);
// format countdown string + set tag value
$('.countdown').html(days + "d, " + hours + "h, "+ minutes + "m, " + seconds + "s");
}, 1000);
}
任何帮助将不胜感激。
您可以在脚本开始改变这种
function setTimer(hours, minutes, dateTime){
var date = new Date(dateTime);
date.setHours(date.getHours() + hours);
date.setMinutes(date.getMinutes() + minutes);
var target_date = date.getTime();
// rest of script
}
然后只是setTimer(1,30, "2014 09 24 00:23")
调用它来设置倒计时相对于2014年9月24日01:53
看看这里:jsFiddle
我想为此推荐Moment.js(以及任何类型的日期/时间解析)。尽管编写自己的函数看起来很诱人,但通常还有很多事情需要考虑,而且这不值得。
使用Moment.js,你想达到什么可以做这样的:
function clockTicking(){
var target_date = moment('Aug 15, 2019', 'MMM DD, YYYY');
// update the tag with id "countdown" every 1 second
setInterval(function() {
var moment_diff = moment.duration(target_date.diff(moment()));
// format countdown string + set tag value
$('.countdown').html(moment_diff.days() + "d, " + moment_diff.hours() + "h, "+ moment_diff.minutes() + "m, " + moment_diff.seconds() + "s");
}, 1000);
}
当然,记住这个特殊的例子是不正确的,因为相差过大(其只有在差值小于一个月的情况下才能正常工作),但它不应该是一个问题,因为您在原始文章中提到,差异通常应以小时而非年为单位来衡量。
我一定会看看Moment.js,谢谢你的提示。 :) – 2014-09-23 22:13:53
我真的考虑使用:
如果你正在做的日期时间相当数量的处理。
但是,它看起来像你有麻烦将您的两种时间格式转换为日期时间对象?
var stripNonNumberics = function(string) {
return Number(string.replace(/\D/g, ''));
}
var target_date = "1hour 45minutes"; // or var target_date = "45minutes";
var split_date = target_date.split(' ');
var minutes;
// If it has hours
if (split_date[1]) {
minutes = stripNonNumberics(split_date[1]) + (stripNonNumberics(split_date[0]) * 60);
} else {
minutes = stripNonNumberics(split_date[0]);
}
console.log(new Date(new Date().getTime() + minutes*60000););
谢谢你:) – 2014-09-23 22:12:44
我不再使用db中的Datetime格式。下订单时,计算交货时间并以“小时,分钟”的格式插入分贝。 – 2014-09-24 00:47:02
Humm,我觉得我感到困惑,我总是需要一段时间来比较,作为初始点,否则当我刷新页面时,它总是会假设Now()时间作为比较点。 – 2014-09-24 00:49:47
我们需要知道客户下订单时的日期时间+交货时间或到期时间,以便能够完成您想要的任务。 – 2014-09-24 00:53:26