2017-07-27 4 views
1

Hoffen, dass Sie alle gut sind,wie angezeigt Jahre, Monate, Wochen und Tage seit einem Datum

Ich habe kämpfen, um einen Weg zu finden, um die Menge an Zeit anzuzeigen, die seit einem bestimmten Datum in Jahren bestanden haben , Monate, Wochen und Tage. Das nächste, was ich gefunden habe, ist das unten, aber ich kann ziemlich gut herausfinden, wie man es bekommt, um die Jahre und Monate anzuzeigen.

Alle Tipps würden sehr geschätzt werden.

Dank

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>

- Dank für die Anregung des früheren Post, leider habe ich das versucht, und ich kann es nur die Differenz zwischen zwei tatsächlichen Daten an die Arbeit, i Es kann nicht automatisch das Enddatum festlegen, sodass es im Laufe der Zeit automatisch hoch gezählt wird.

- ich habe etwas mehr fiedeln und schaffte es, zu diesem zu kommen, neu zu js, würdest du sagen, das ist ziemlich nah? Dank

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> 
+3

Verwenden Sie die 'momentjs'-Bibliothek. Es wird helfen, Datum in Javascript zu behandeln: https://momentjs.com/ –

+1

Was nicht funktioniert ?? – Salketer

+0

Mögliches Duplikat von [Unterschied zwischen zwei Datumsangaben in Jahren, Monaten, Tagen in JavaScript] (https://stackoverflow.com/questions/17732897/difference-between-two-dates-in-years-months-days-in-javascript) – Salketer

Antwort

0

Einfach, ungefähre Differenz

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>

Precise Unterschied mit momentjs und precise range plugin

function calculateDifference(thenString) { 
 
\t var m1 = moment(Date.now()) 
 
\t var m2 = moment(new Date(thenString)) 
 
\t 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/[email protected]"></script> 
 
<script src="https://unpkg.com/[email protected]"></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>

+0

unglaublich! Vielen Dank – lionnn

+0

Nochmals vielen Dank, ich frage mich nur, gibt es eine einfache Möglichkeit, Skripte wie dieses auf Safari zu arbeiten? – lionnn

+0

@lionnn Was ist das Problem mit Safari? – marzelin

Verwandte Themen