2017-02-26 11 views
1

私は2つの時間入力の差を求め、それをHH:mm:ssとして表示しようとしています。javacriptの2つの時間入力の秒差を計算する

id="diff"の入力ボックスが表示用に作成されました。このコードは最大24時間の違いに対応しています。

ただし、開始時刻または終了時刻の秒の入力が0(例:11:10:00 PM)の場合、ディスプレイにはNaNが反映されます。

誰もが問題が何であるか知っていますか?数秒であなたの "00" が渡されることは決してありませんのでです

var start = document.getElementById("start").value; 
 
var end = document.getElementById("end").value; 
 

 
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); 
 

 
    //for calculation to work if endtime cross over next day. Eg. 11pm to 2am 
 
    if (endDate.getTime() < startDate.getTime()) { 
 
     endDate.setDate(endDate.getDate() + 1); 
 
    } 
 

 
    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); 
 

 

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

 
} 
 

 
document.getElementById("diff").value = diff(start, end);
<input type="time" id="start" step="1" value=""> 
 
<input type="time" id="end" step="1" value=""> 
 
<input id="diff">

+1

あなただけの、UNIXの時刻にこれら2件のデータを解析し、それを減算して、再度日付オブジェクトに変更した場合に容易ではないでしょうか? –

答えて

1

。わずか数分と数時間が経過します。だから、あなたの日付はそれが起こるとき無効です。

分割配列の最後のパラメータをチェックし、tが存在しない場合はゼロを渡します。これを変更

試してみてください。これに

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 startDate = new Date(0, 0, 0, start[0], start[1], start[2] ? start[2] : 0, 0); 
var endDate = new Date(0, 0, 0, end[0], end[1], end[2] ? end[2] : 0, 0); 
+0

それはすばらしく動作します。どうもありがとうございます! – Edwin

+0

いつでも。あなたは答えとしてそれを受け入れることができます。 :) – dev8080

関連する問題