繁体   English   中英

如何显示自日期以来的年、月、周和日

[英]how to display years, months, weeks and days since a date

希望你们一切都好

我一直在努力寻找一种方法来显示自特定日期以来经过的时间(以年、月、周和日为单位)。 我发现的最接近的是下面这个,但我可以弄清楚如何让它显示年份和月份。

任何提示将不胜感激。

谢谢

 window.onload = function() { doTime('jan,01,2017,00:00:01'); } function doTime(then) { now = new Date(); then = new Date(then); difference = (now - then); days = Math.floor(difference / (60 * 60 * 1000 * 24) * 1); hours = Math.floor((difference % (60 * 60 * 1000 * 24)) / (60 * 60 * 1000) * 1); mins = Math.floor(((difference % (60 * 60 * 1000 * 24)) % (60 * 60 * 1000)) / (60 * 1000) * 1); secs = Math.floor((((difference % (60 * 60 * 1000 * 24)) % (60 * 60 * 1000)) % (60 * 1000)) / 1000 * 1); document.getElementById('timer').firstChild.nodeValue = +days + ' days ' + hours + ' hours ' + mins + ' minutes ' + secs + ' seconds'; clearTimeout(doTime.to); doTime.to = setTimeout(function() { doTime(then); }, 1000); }
 <div id="timer">&nbsp;</div>

- 感谢上一篇文章的建议,遗憾的是我已经尝试过了,我只能让它工作两个实际日期之间的差异,我现在无法让它自动设置结束日期,所以它会随着时间的推移自动计数.

- 我做了更多的摆弄并设法做到了这一点,作为 js 的新手,你们会说这很接近吗? 谢谢

var startDateTime = new Date(2012,5,24,09,43,0,0); // YYYY (M-1) D H m s 
(start time and date from DB)
var startStamp = startDateTime.getTime();

var newDate = new Date();
var newStamp = newDate.getTime();

var timer;

function updateClock() {
    newDate = new Date();
    newStamp = newDate.getTime();
    var diff = Math.round((newStamp-startStamp)/1000)

    var years = Math.floor(diff/(12*4.3479*7*24*60*60));
     diff = diff-(years*12*4.3479*7*24*60*60)


    var months = Math.floor(diff/(4.3479*7*24*60*60));
    diff = diff-(months*4.3479*7*24*60*60)

    var weeks = Math.floor(diff/(7*24*60*60));
    diff = diff-(weeks*7*24*60*60)

    var days = Math.floor(diff/(24*60*60));
    diff = diff-(days*24*60*60);
    var hours = Math.floor(diff/(60*60));
    diff = diff-(hours*60*60);
    var mins = Math.floor(diff/(60));
    diff = diff-(mins*60);
    var secs = diff;

    document.getElementById("time-elapsed").innerHTML = years+" years, 
"+months+" months, " +weeks+" weeks, " +days+" days, "+hours+" hours and 
"+mins+" minutes,";
}

setInterval(updateClock, 1000);



<div id="time-elapsed"></div>

简单、近似的区别

 function calculateDifference(thenString) { const second = 1000 const minute = 60 * second const hour = 60 * minute const day = 24 * hour const month = 30 * day // approximately const year = 365 * day // approximately const now = new Date(); const then = new Date(thenString); let difference = (now - then); const time = [{ year }, { month }, { day }, { hour }, { minute }, { second }].map((item, i, a) => { const [[unitName, unit]] = Object.entries(item) const units = difference / unit | 0 difference -= unit * units const maybePlural = units === 1 ? "" : "s" return units > 0 ? units + " " + unitName + maybePlural : "" }).filter(x => x) const formattedTime = time.length > 1 ? [...time.slice(0, -1), "and", time.slice(-1)].join(" ") : time[1] return formattedTime } function displayDifference() { displayBox.textContent = calculateDifference(dateInput.value + ", " + timeInput.value) } const dateInput = document.querySelector(".date") const timeInput = document.querySelector(".time") const displayBox = document.querySelector(".js-display-difference") dateInput.addEventListener("change", displayDifference) timeInput.addEventListener("change", displayDifference) displayDifference() setInterval(displayDifference, 1000)
 <h3> since <input class="date" type="date" value="2017-01-01"/> <input class="time" type="time" value="00:00"/> elapsed <span class="js-display-difference"></span> </h3>

momentjsprecise range plugin精确差异

 function calculateDifference(thenString) { var m1 = moment(Date.now()) var m2 = moment(new Date(thenString)) var diff = moment.preciseDiff(m1, m2) return diff } function displayDifference() { displayBox.textContent = calculateDifference(dateInput.value + ", " + timeInput.value) } const dateInput = document.querySelector(".date") const timeInput = document.querySelector(".time") const displayBox = document.querySelector(".js-display-difference") dateInput.addEventListener("change", displayDifference) timeInput.addEventListener("change", displayDifference) displayDifference() setInterval(displayDifference, 1000)
 <script src="https://unpkg.com/moment@2.18.1"></script> <script src="https://unpkg.com/moment-precise-range-plugin@1.2.3"></script> <h3> since <input class="date" type="date" value="2017-01-01"/> <input class="time" type="time" value="00:00"/> elapsed <span class="js-display-difference"></span>

我不是 IT 专家,所以可能有更好的方法,但我所做的似乎有效。 一个例子可以在这里看到:行动中的日期差异

我的方法不是计算从第一次约会开始的天数差异,而是从“开始日期”中的日期位置计算出“截止日期”中的日期位置。 也就是说,在我 60 岁生日那天,我出生以来已经过了 15 个闰年,但那些日子不算在内。 我今年 60 岁,而不是 60 岁零 15 天。

为了证明我不是 IT 专家,我无法发布代码,但您可以查看示例中的源代码。 顺便说一句,我只使用 chrome/edge,所以没有在其他平台上测试过。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM