Прежде всего хотел бы упомянуть, я обыскал SO и не смог найти ответ на этот конкретный вопрос. Есть сообщение с этой темой, откуда я получил код ниже и другие места в google.
Проблема. Я пытаюсь получить точные минуты, потраченные с момента начала и окончания. Проблема заключается в том, что я не знаю, как отделить ":" в моей метке времени, которая вызывает ошибку "NaN".
HTML-страница:
<input type="text" id="start_time">
<input type="text" id="end_time">
<input type="text" id="minutes_spent">
<input type="button" onclick="ce()">
Javascript:
function toSeconds(time_str) {
var parts = time_str.split(':');
return parseInt(parts[0]) * 3600
+
parseInt(parts[1]) * 60 +
+
parseInt(parts[2]);
var a = document.getElementByID('start_time').value;
var b = document.getElementByID('end_time').value;
var difference = Math.abs(toSeconds(a) - toSeconds(b));
var result = [ Math.floor(difference / 3600), Math.floor((difference % 3600) / 60), difference % 60 ];
result = result.map(function(v) { return v < 10 ? '0' + v : v; }).join(':');
document.getElementByID('minutes_spent').value = result;
}
Следующий код получит пользовательский ввод для временных меток и даст разницу jsFiddle
HTML:
START:<input id="start_time" type="text"/>format "HH:MM:SS"<br/><br/>
END:<input id="end_time" type="text"/>format "HH:MM:SS"<br/><br/>
<input type="button" id="diff" onclick="getDiff()" value="Calc"/>
<br/><br/>
Hours:<input id="time_spent_hours" type="text" size="3"/>
Minutes:<input id="time_spent_mins" type="text" size="2"/>
Seconds:<input id="time_spent_secs" type="text" size="2"/>
JS:
function getDiff() {
var ts1 = document.getElementById('start_time').value;
var ts2 = document.getElementById('end_time').value;
if((/[0-9]?[0-9]:[0-9]?[0-9]:[0-9]?[0-9]/).test(ts1)==false) {
alert("start time format is wrong");
return;
}
if((/[0-9]?[0-9]:[0-9]?[0-9]:[0-9]?[0-9]/).test(ts2)==false) {
alert("end time format is wrong");
return;
}
var arr1 = ts1.split(":");
var arr2 = ts2.split(":");
var hrs = "0";
var mins = "0";
var secs = "0";
var secs = (parseInt(arr2[0])*60*60 + parseInt(arr2[1])*60 + parseInt(arr2[2])) - (parseInt(arr1[0])*60*60 + parseInt(arr1[1])*60 + parseInt(arr1[2]));
if(secs<0) {
alert("start time is greater than end time");
return;
}
if(secs>60) {
mins = Math.round(secs/60);
secs = secs%60;
if(mins>60) {
hrs = Math.round(mins/60);
mins = mins%60;
}
}
document.getElementById('time_spent_secs').value = secs;
document.getElementById('time_spent_mins').value = mins;
document.getElementById('time_spent_hours').value = hrs;
}
Где функция ce()
которую вы вызываете onclick?
Если вы вставили выше код в один файл HTML и vab b
его, то var a
и vab b
будут иметь значение null. Поскольку оба поля ввода будут пустыми во время загрузки, и ваш JS начнет выполнение (в соответствии с кодом, который я вижу выше).
Логически это выглядит отлично, попробуйте создать модульные функции и выполнить приведенный выше код.
}
кронштейн дляtoSeconds
? Также1 + "1" === "11"
( Number+
String=
String ). Этого не происходит, потому что вы сделали1 + + '1'
с+
s, скрытыми над новыми строками D: