Come ottengo la differenza tra due date in JavaScript?


111

Sto creando un'applicazione che ti permette di definire eventi con un lasso di tempo. Voglio inserire automaticamente la data di fine quando l'utente seleziona o modifica la data di inizio. Non riesco a capire, tuttavia, come ottenere la differenza tra i due tempi e quindi come creare una nuova data di fine utilizzando tale differenza.

Risposte:


73

In JavaScript, le date possono essere trasformate nel numero di millisecondi dall'epoc chiamando il getTime()metodo o semplicemente utilizzando la data in un'espressione numerica.

Quindi, per ottenere la differenza, basta sottrarre le due date.

Per creare una nuova data in base alla differenza, è sufficiente passare il numero di millisecondi nel costruttore.

var oldBegin = ...
var oldEnd = ...
var newBegin = ...

var newEnd = new Date(newBegin + oldEnd - oldBegin);

Questo dovrebbe funzionare

EDIT : bug corretto segnalato da @bdukes

MODIFICA :

Per una spiegazione del comportamento, oldBegin, oldEnd, e newBeginsono Datele istanze. Chiamare gli operatori +e -si innescherà Javascript auto casting e chiamerà automaticamente il valueOf()metodo di prototipo di quegli oggetti. Succede che il valueOf()metodo sia implementato Datenell'oggetto come una chiamata a getTime().

Quindi in poche parole: date.getTime() === date.valueOf() === (0 + date) === (+date)


Qual è il formato richiesto per il funzionamento di .getTime () ... Ad esempio - new Date ('22 -12-2012 00:00 '). GetTime () non funzionerà ... Qualche idea?
Jimmyt1988

1
Per l'analisi della data in JS, ti suggerisco di dare un'occhiata a questa domanda: stackoverflow.com/questions/1576753/…
Vincent Robert

8
OldBegin, oldEnd e NewBegin dovrebbero essere Dateoggetti? È difficile dire che tipo di oggetto dovrebbero essere, poiché la dichiarazione della variabile è omessa qui.
Anderson Green

Inoltre, c'è una funzione che puoi utilizzare per aggiungere o sottrarre date in JavaScript: stackoverflow.com/a/1214753/975097
Anderson Green

Fai attenzione quando aggiungi numeri e giorni. Vedi la mia risposta sotto per la spiegazione
Dan

24

JavaScript supporta perfettamente la differenza di data fuori dagli schemi

var msMinute = 60*1000, 
    msDay = 60*60*24*1000,
    a = new Date(2012, 2, 12, 23, 59, 59),
    b = new Date("2013 march 12");


console.log(Math.floor((b - a) / msDay) + ' full days between');
console.log(Math.floor(((b - a) % msDay) / msMinute) + ' full minutes between');

Ora alcune insidie. Prova questo:

console.log(a - 10);
console.log(a + 10);

Quindi, se hai il rischio di aggiungere un numero e una data, converti la data numberdirettamente in.

console.log(a.getTime() - 10);
console.log(a.getTime() + 10);

Il mio primo esempio dimostra la potenza dell'oggetto Date, ma in realtà sembra essere una bomba a orologeria


Dan, ho trovato il tuo esempio il più facile da capire e da seguire. Grazie.
Melanie

5
Le "insidie" sono in realtà le impostazioni predefinite basate sulle specifiche del linguaggio. L'operatore di sottrazione -costringe gli argomenti a numero, quindi la data restituisce il suo valore di ora. L' +operatore è sovraccarico, quindi potrebbe fare addizione, coercizione al numero o concatenazione. Poiché in questo caso Dates forza a String, +esegue la concatenazione. La confusione non è colpa dell'oggetto Date, ma dell'overload degli operatori.
RobG

9

Vedi JsFiddle DEMO

    var date1 = new Date();    
    var date2 = new Date("2025/07/30 21:59:00");
    //Customise date2 for your required future time

    showDiff();

function showDiff(date1, date2){

    var diff = (date2 - date1)/1000;
    diff = Math.abs(Math.floor(diff));

    var days = Math.floor(diff/(24*60*60));
    var leftSec = diff - days * 24*60*60;

    var hrs = Math.floor(leftSec/(60*60));
    var leftSec = leftSec - hrs * 60*60;

    var min = Math.floor(leftSec/(60));
    var leftSec = leftSec - min * 60;

    document.getElementById("showTime").innerHTML = "You have " + days + " days " + hrs + " hours " + min + " minutes and " + leftSec + " seconds before death.";

setTimeout(showDiff,1000);
}

per il tuo codice HTML:

<div id="showTime"></div>

4

Se non ti interessa la componente temporale, puoi usare .getDate()e.setDate() per impostare solo la parte della data.

Quindi, per impostare la data di fine a 2 settimane dopo la data di inizio, fai qualcosa del genere:

function GetEndDate(startDate)
{
    var endDate = new Date(startDate.getTime());
    endDate.setDate(endDate.getDate()+14);
    return endDate;
}

Per restituire la differenza (in giorni) tra due date, procedere come segue:

function GetDateDiff(startDate, endDate)
{
    return endDate.getDate() - startDate.getDate();
}

Infine, modifichiamo la prima funzione in modo che possa prendere il valore restituito da 2nd come parametro:

function GetEndDate(startDate, days)
{
    var endDate = new Date(startDate.getTime());
    endDate.setDate(endDate.getDate() + days);
    return endDate;
}

31
GetDateDiff()supererà le barriere mensili. Ad esempio, 2011/04/26 e 2011/05/01 restituiranno -25, ma l'offset dovrebbe essere di 5 giorni.
nfm

var ds = nuova data (2014, 0, 31, 0, 0, 0, 0); var de = nuova data (2014, 2, 31, 0, 0, 0, 0); GetDateDiff (ds, de) return 0
Noor

3

Grazie @ Vincent Robert , ho finito per usare il tuo esempio di base, anche se in realtà lo è newBegin + oldEnd - oldBegin. Ecco la soluzione finale semplificata:

    // don't update end date if there's already an end date but not an old start date
    if (!oldEnd || oldBegin) {
        var selectedDateSpan = 1800000; // 30 minutes
        if (oldEnd) {
            selectedDateSpan = oldEnd - oldBegin;
        }

       newEnd = new Date(newBegin.getTime() + selectedDateSpan));
    }

1
È un buon punto spiegare perché a volte stai usando getTimee talvolta no
Dan

2

A seconda delle esigenze, questa funzione calcolerà la differenza tra i 2 giorni e restituirà un risultato in giorni decimali.

// This one returns a signed decimal. The sign indicates past or future.

this.getDateDiff = function(date1, date2) {
    return (date1.getTime() - date2.getTime()) / (1000 * 60 * 60 * 24);
}

// This one always returns a positive decimal. (Suggested by Koen below)

this.getDateDiff = function(date1, date2) {
    return Math.abs((date1.getTime() - date2.getTime()) / (1000 * 60 * 60 * 24));
}

1
Inseriscilo in una Math.abs()chiamata e otterrai sempre un decimale positivo.
Koen.

1
Bel suggerimento Koen. Ciò offre alle persone 2 opzioni: solo la differenza di data vera come suggerito, o un datiff con il segno che indica se la differenza è nel passato o nel futuro. :)
sparkyspider

Tieni presente che in JavaScript puoi anche aggiungere / sottrarre un numero in millisecondi date.getTime()per ottenere il tempo in futuro / passato. `var nextMinute = new Date (someDate.getTime () + 60 * 1000);
Dan

Questo è un errore di battitura? "tra i 2 giorni". Probabilmente tra 2 date.
tomazahlin

2

Se usi moment.js, c'è una soluzione più semplice, che ti darà la differenza in giorni in una singola riga di codice.

moment(endDate).diff(moment(beginDate), 'days');

Ulteriori dettagli possono essere trovati nella pagina moment.js

Salute, Miguel


1
function compare()
{
  var end_actual_time    = $('#date3').val();

  start_actual_time = new Date();
  end_actual_time = new Date(end_actual_time);

  var diff = end_actual_time-start_actual_time;

  var diffSeconds = diff/1000;
  var HH = Math.floor(diffSeconds/3600);
  var MM = Math.floor(diffSeconds%3600)/60;

  var formatted = ((HH < 10)?("0" + HH):HH) + ":" + ((MM < 10)?("0" + MM):MM)
  getTime(diffSeconds);
}
function getTime(seconds) {
  var days = Math.floor(leftover / 86400);

  //how many seconds are left
  leftover = leftover - (days * 86400);

  //how many full hours fits in the amount of leftover seconds
  var hours = Math.floor(leftover / 3600);

  //how many seconds are left
  leftover = leftover - (hours * 3600);

  //how many minutes fits in the amount of leftover seconds
  var minutes = leftover / 60;

  //how many seconds are left
  //leftover = leftover - (minutes * 60);
  alert(days + ':' + hours + ':' + minutes);
}

1

modifica alternativa codice esteso ..

http://jsfiddle.net/vvGPQ/48/

showDiff();

function showDiff(){
var date1 = new Date("2013/01/18 06:59:00");   
var date2 = new Date();
//Customise date2 for your required future time

var diff = (date2 - date1)/1000;
var diff = Math.abs(Math.floor(diff));

var years = Math.floor(diff/(365*24*60*60));
var leftSec = diff - years * 365*24*60*60;

var month = Math.floor(leftSec/((365/12)*24*60*60));
var leftSec = leftSec - month * (365/12)*24*60*60;    

var days = Math.floor(leftSec/(24*60*60));
var leftSec = leftSec - days * 24*60*60;

var hrs = Math.floor(leftSec/(60*60));
var leftSec = leftSec - hrs * 60*60;

var min = Math.floor(leftSec/(60));
var leftSec = leftSec - min * 60;




document.getElementById("showTime").innerHTML = "You have " + years + " years "+ month + " month " + days + " days " + hrs + " hours " + min + " minutes and " + leftSec + " seconds the life time has passed.";

setTimeout(showDiff,1000);
}

Aggiungi ulteriori chiarimenti alla tua risposta e utilizza un inglese migliore.
Finanzia la causa di Monica

Questa soluzione è sbagliata perché usi 365 giorni, trascurando gli anni bisestili.
Sergey Goliney

0
function checkdate() {
    var indate = new Date()
    indate.setDate(dat)
    indate.setMonth(mon - 1)
    indate.setFullYear(year)

    var one_day = 1000 * 60 * 60 * 24
    var diff = Math.ceil((indate.getTime() - now.getTime()) / (one_day))
    var str = diff + " days are remaining.."
    document.getElementById('print').innerHTML = str.fontcolor('blue')
}

0
<html>
<head>
<script>
function dayDiff()
{
     var start = document.getElementById("datepicker").value;
     var end= document.getElementById("date_picker").value;
     var oneDay = 24*60*60*1000; 
     var firstDate = new Date(start);
     var secondDate = new Date(end);    
     var diffDays = Math.round(Math.abs((firstDate.getTime() - secondDate.getTime())/(oneDay)));
    document.getElementById("leave").value =diffDays ;
 }
</script>
</head>
<body>
<input type="text" name="datepicker"value=""/>
<input type="text" name="date_picker" onclick="function dayDiff()" value=""/>
<input type="text" name="leave" value=""/>
</body>
</html>

0

questo codice riempie la durata degli anni di studio quando si inserisce la data di inizio e la data di fine (qualifica data di maturazione) dello studio e si controlla se la durata è inferiore a un anno se sì l'avviso un messaggio tiene presente ci sono tre elementi di input il primo txtFromQualifDatee secondo txtQualifDatee terzotxtStudyYears

mostrerà il risultato del numero di anni con frazione

function getStudyYears()
    {
        if(document.getElementById('txtFromQualifDate').value != '' && document.getElementById('txtQualifDate').value != '')
        {
            var d1 = document.getElementById('txtFromQualifDate').value;

            var d2 = document.getElementById('txtQualifDate').value;

            var one_day=1000*60*60*24;

            var x = d1.split("/");
            var y = d2.split("/");

            var date1=new Date(x[2],(x[1]-1),x[0]);

            var date2=new Date(y[2],(y[1]-1),y[0])

            var dDays = (date2.getTime()-date1.getTime())/one_day;

            if(dDays < 365)
            {
                alert("the date between start study and graduate must not be less than a year !");

                document.getElementById('txtQualifDate').value = "";
                document.getElementById('txtStudyYears').value = "";

                return ;
            }

            var dMonths = Math.ceil(dDays / 30);

            var dYears = Math.floor(dMonths /12) + "." + dMonths % 12;

            document.getElementById('txtStudyYears').value = dYears;
        }
    }

1
Non analizzare mai le stringhe di data per trovare l'anno perché l'aspetto della stringa (specialmente i separatori) differisce tra i browser. Usa getFullYearche è stato progettato per questo. ------- Vedi la libreria datejs su googlecode che probabilmente supporta la maggior parte dei casi d'angolo
Dan

grazie per il consiglio @ Dan ma ha funzionato e testato per me su un progetto di governo reale (browser diversi) è una pratica di programmazione debole? :)
shareef

0

Se si utilizzano oggetti Date e quindi si utilizza la getTime()funzione per entrambe le date, verranno fornite le rispettive ore dal 1 gennaio 1970 in un valore numerico. È quindi possibile ottenere la differenza tra questi numeri.

Se questo non ti aiuta, controlla la documentazione completa: http://www.w3schools.com/jsref/jsref_obj_date.asp


Oh, sì, non l'ho notato, le risposte sotto questa hanno al massimo sei anni.
Koen.

0

Il codice sottostante restituirà i giorni rimasti da oggi alla data dei futures.

Dipendenze: jQuery e MomentJs.

var getDaysLeft = function (date) {
  var today = new Date();
  var daysLeftInMilliSec = Math.abs(new Date(moment(today).format('YYYY-MM-DD')) - new Date(date));
  var daysLeft = daysLeftInMilliSec / (1000 * 60 * 60 * 24);   
  return daysLeft;
};

getDaysLeft('YYYY-MM-DD');

0
var getDaysLeft = function (date1, date2) {
   var daysDiffInMilliSec = Math.abs(new Date(date1) - new Date(date2));
   var daysLeft = daysDiffInMilliSec / (1000 * 60 * 60 * 24);   
   return daysLeft;
};
var date1='2018-05-18';
var date2='2018-05-25';
var dateDiff = getDaysLeft(date1, date2);
console.log(dateDiff);

0

ECCO COSA HO FATTO SUL MIO SISTEMA.

var startTime=("08:00:00").split(":");
var endTime=("16:00:00").split(":");
var HoursInMinutes=((parseInt(endTime[0])*60)+parseInt(endTime[1]))-((parseInt(startTime[0])*60)+parseInt(startTime[1]));
console.log(HoursInMinutes/60);
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.