web-dev-qa-db-fra.com

Calculer le décalage horaire avec JavaScript

J'ai deux zones de saisie HTML, qui doivent calculer la différence de temps dans JavaScript onBlur (puisque j'en ai besoin en temps réel) et insérer le résultat dans une nouvelle zone de saisie.

Exemple de format: 10:00 & 12:30 besoin de me donner: 02:30

Merci!

javascripttime
10
user1424332

Voici une solution possible:

function diff(start, end) {
    start = start.split(":");
    end = end.split(":");
    var startDate = new Date(0, 0, 0, start[0], start[1], 0);
    var endDate = new Date(0, 0, 0, end[0], end[1], 0);
    var diff = endDate.getTime() - startDate.getTime();
    var hours = Math.floor(diff / 1000 / 60 / 60);
    diff -= hours * 1000 * 60 * 60;
    var minutes = Math.floor(diff / 1000 / 60);

    // If using time pickers with 24 hours format, add the below line get exact hours
    if (hours < 0)
       hours = hours + 24;

    return (hours <= 9 ? "0" : "") + hours + ":" + (minutes <= 9 ? "0" : "") + minutes;
}

DEMO: http://jsfiddle.net/KQQqp/

29
VisioN

Eh bien ce travail presque génial. Maintenant, utilisez ce code pour calculer: 23:50 - 00:10 Et voyez ce que vous obtenez.Ou même 23:30 - 01:30. C'est un désordre. Parce qu'obtenir la réponse dans l'autre sens en php est:

$date1 = strtotime($_POST['started']);
$date2 = strtotime($_POST['ended']);
$interval = $date2 - $date1;
$playedtime = $interval / 60;

Mais quand même, cela fonctionne comme le vôtre. Je suppose que vous devez également indiquer les dates.

Et encore une fois: mes recherches et mon développement m'ont aidé.

if (isset($_POST['calculate'])) {
$d1 = $_POST['started'];
$d2 = $_POST['ended'];
if ($d2 < $d1) {
    $date22 = date('Y-m-');
    $date222 = date('d')-1;
    $date2 = $date22."".$date222;
} else {
$date2 = date('Y-m-d');
}
$date1 = date('Y-m-d');
$start_time = strtotime($date2.' '.$d1);
$end_time = strtotime($date1.' '.$d2); // or use date('Y-m-d H:i:s') for current time
$playedtime = round(abs($start_time - $end_time) / 60,2);
}

Et c'est ainsi que vous calculez l'heure jusqu'au lendemain. // edit. D'abord j'avais date1 jnd date2 changé. J'ai besoin de -1 car ce calcul ne vient que le lendemain et la première date a eu lieu hier.

Après une amélioration et beaucoup de puissance cérébrale avec mon ami, nous en sommes venus à ceci:

$begin=mktime(substr($_GET["start"], 0,2),substr($_GET["start"], 2,2),0,1,2,2003);
$end=mktime(substr($_GET["end"], 0,2),substr($_GET["end"], 2,2),0,1,3,2003);
$outcome=($end-$begin)-date("Z");
$minutes=date("i",$outcome)+date("H",$outcome)*60; //Echo minutes only
$hours = date("H:i", $outcome); //Echo time in hours + minutes like 01:10 or something.

Vous n'avez donc besoin que de 4 lignes de code pour obtenir votre résultat. Vous ne pouvez prendre que quelques minutes ou afficher le temps complet (la différence est égale à 02:32) en 2 heures et 32 ​​minutes. L'important: Vous pouvez néanmoins calculer la nuit en 24 heures, à savoir: Heure de début 23:50 to let disons 01h00 (en 24 heures: 23h50 - 01h00), car en mode 12 heures, cela fonctionne quand même.

Le plus important: vous n'avez pas à formater votre entrée. Vous pouvez utiliser simplement 2300 comme entrée 23:00. Ce script convertira les champs de texte au format correct lui-même. Le dernier script utilise le formulaire HTML standard avec method = "get", mais vous pouvez le convertir pour utiliser également la méthode POST.

2
Germo

Avec les secondes que vous avez fournies, vous ne trouverez pas de résultat, veuillez trouver ma fonction mise à jour vous donnant les bonnes secondes ici - Par Dinesh J

function diff(start, end) {
    start = start.split(":");
    end = end.split(":");
    var startDate = new Date(0, 0, 0, start[0], start[1],start[2], 0);
    var endDate = new Date(0, 0, 0, end[0], end[1],end[2], 0);
    var diff = endDate.getTime() - startDate.getTime();
    var hours = Math.floor(diff / 1000 / 60 / 60);
    diff -= hours * 1000 * 60 * 60;
    var minutes = Math.floor(diff / 1000 / 60);
    var seconds = Math.floor(diff / 1000)-120;

    // If using time pickers with 24 hours format, add the below line get exact hours
    if (hours < 0)
        hours = hours + 24;

    return (hours <= 9 ? "0" : "") + hours + ":" + (minutes <= 9 ? "0" : "") + minutes+ ":" + (seconds <= 9 ? "0" : "") + seconds;
}
1
user8584085

Ceci est une version mise à jour de celle qui a déjà été soumise. C'est avec les secondes.

function diff(start, end) {
    start = start.split(":");
    end = end.split(":");
    var startDate = new Date(0, 0, 0, start[0], start[1], 0);
    var endDate = new Date(0, 0, 0, end[0], end[1], 0);
    var diff = endDate.getTime() - startDate.getTime();
    var hours = Math.floor(diff / 1000 / 60 / 60);
    diff -= hours * (1000 * 60 * 60);
    var minutes = Math.floor(diff / 1000 / 60);
    diff -= minutes * (1000 * 60);
    var seconds = Math.floor(diff / 1000);

    // If using time pickers with 24 hours format, add the below line get exact hours
    if (hours < 0)
       hours = hours + 24;

    return (hours <= 9 ? "0" : "") + hours + ":" + (minutes <= 9 ? "0" : "") + minutes + (seconds<= 9 ? "0" : "") + seconds;
}

Ma version mise à jour:

Vous permet de convertir les dates en millisecondes et de vous en départir au lieu de vous séparer.

Exemple: années/mois/semaines/jours/heures/minutes/secondes

Exemple: https://jsfiddle.net/jff7ncyk/308/

0
xDemonsxXxSaintx

Essaye ça

var dif = ( new Date("1970-1-1 " + end-time) - new Date("1970-1-1 " + start-time) ) / 1000 / 60 / 60;
0
Abhishek Motiwale

En fonction de ce que vous autorisez à entrer, celui-ci fonctionnera. Il peut y avoir des problèmes de limites si vous souhaitez permettre 1 heure-13 heures

REMARQUE: ceci n'utilise PAS d'objets de date ou de moment.js 

function pad(num) {
  return ("0"+num).slice(-2);
}
function diffTime(start,end) {
  var s = start.split(":"), sMin = +s[1] + s[0]*60,
      e =   end.split(":"), eMin = +e[1] + e[0]*60,
   diff = eMin-sMin;
  if (diff<0) { sMin-=12*60;  diff = eMin-sMin }
  var h = Math.floor(diff / 60),
      m = diff % 60;
  return "" + pad(h) + ":" + pad(m);
}  
document.getElementById('button').onclick=function() {
  document.getElementById('delay').value=diffTime(
      document.getElementById('timeOfCall').value, 
      document.getElementById('timeOfResponse').value
  );
}
<input type="time" id="timeOfCall">
<input type="time" id="timeOfResponse">
<button type="button" id="button">CLICK</button>
<input type="time" id="delay">

0
mplungjan
   calTimeDifference(){
    this.start = dailyattendance.InTime.split(":");
    this.end = dailyattendance.OutTime.split(":");
    var time1 = ((parseInt(this.start[0]) * 60) + parseInt(this.start[1]))
    var time2 = ((parseInt(this.end[0]) * 60) + parseInt(this.end[1]));
    var time3 = ((time2 - time1) / 60);
    var timeHr = parseInt(""+time3);
    var  timeMin = ((time2 - time1) % 60);
}
0
Sanket Parchande