Je crée une application qui vous permet de définir des événements avec un laps de temps. Je souhaite renseigner automatiquement la date de fin lorsque l'utilisateur sélectionne ou modifie la date de début. Cependant, je ne comprends pas très bien comment obtenir la différence entre les deux temps, puis comment créer une nouvelle date de fin en utilisant cette différence.
Réponses
Trop de publicités?En JavaScript, les dates peuvent être transformés pour le nombre de millisecondes écoulées depuis le epoc par l'appel de la getTime()
méthode ou simplement à l'aide de la date dans une expression numérique.
Donc, pour obtenir la différence, juste soustraire deux dates.
Pour créer une nouvelle date en fonction de la différence, il suffit de passer le nombre de millisecondes dans le constructeur.
var oldBegin = ...
var oldEnd = ...
var newBegin = ...
var newEnd = new Date(newBegin + oldEnd - oldBegin);
Cela devrait fonctionner
EDIT: correction d'un bug signalé par @bdukes
EDIT:
Pour une explication du comportement, oldBegin
, oldEnd
, et newBegin
sont Date
des cas. Appelant les opérateurs +
et -
déclenchera Javascript automatique de moulage et appelle automatiquement l' valueOf()
méthode de prototype de ces objets. Il arrive que l' valueOf()
méthode est implémentée dans l' Date
objet comme un appel à l' getTime()
.
Donc en gros: date.getTime() === date.valueOf() === (0 + date) === (+date)
JavaScript supporte parfaitement la différence de date hors de la boîte
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');
Maintenant quelques pièges. Essaye ça:
console.log(a - 10);
console.log(a + 10);
Donc, si vous avez le risque d’ajouter un nombre et une date, convertissez-la directement en number
.
console.log(a.getTime() - 10);
console.log(a.getTime() + 10);
Mon premier exemple montre la puissance de l'objet Date, mais il semble en réalité être une bombe à retardement.
showDiff();
function showDiff(){
var date1 = new Date();
var date2 = new Date("2015/07/30 21:59:00");
//Customise date2 for your required future time
var diff = (date2 - date1)/1000;
var 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);
}
pour votre code HTML:
<div id="showTime"></div>
Si vous ne vous souciez pas de la composante heure, vous pouvez utiliser .getDate()
et .setDate()
pour définir simplement la partie de date.
Donc, pour définir votre date de fin à 2 semaines après votre date de début, procédez comme suit:
function GetEndDate(startDate)
{
var endDate = new Date(startDate.getTime());
endDate.setDate(endDate.getDate()+14);
return endDate;
}
Pour renvoyer la différence (en jours) entre deux dates, procédez comme suit:
function GetDateDiff(startDate, endDate)
{
return endDate.getDate() - startDate.getDate();
}
Enfin, modifions la première fonction pour qu’elle prenne la valeur renvoyée par 2nd comme paramètre:
function GetEndDate(startDate, days)
{
var endDate = new Date(startDate.getTime());
endDate.setDate(endDate.getDate() + days);
return endDate;
}
Merci @ Vincent Robert , j'ai fini par utiliser votre exemple de base, bien qu'il s'agisse en réalité de newBegin + oldEnd - oldBegin
. Voici la solution finale simplifiée:
// 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));
}