時間枠でイベントを定義できるアプリケーションを作成しています。ユーザーが開始日を選択または変更したときに、終了日を自動的に入力したい。ただし、2 つの時間の差を取得する方法と、その差を使用して新しい終了日を作成する方法がよくわかりません。
16 に答える
getTime()
JavaScript では、メソッドを呼び出すか、数値式で日付を使用するだけで、エポック以降のミリ秒数に日付を変換できます。
したがって、差を得るには、2 つの日付を減算するだけです。
差に基づいて新しい日付を作成するには、コンストラクターでミリ秒数を渡すだけです。
var oldBegin = ...
var oldEnd = ...
var newBegin = ...
var newEnd = new Date(newBegin + oldEnd - oldBegin);
これはうまくいくはずです
編集:@bdukesが指摘したバグを修正
編集:
動作の説明については、oldBegin
、oldEnd
、およびnewBegin
がDate
インスタンスです。演算子+
とを呼び出すと-
、Javascript の自動キャストがトリガーされvalueOf()
、それらのオブジェクトのプロトタイプ メソッドが自動的に呼び出されます。メソッドがへの呼び出しとしてオブジェクトにvalueOf()
実装されている場合があります。Date
getTime()
だから基本的に:date.getTime() === date.valueOf() === (0 + date) === (+date)
JavaScript はすぐに日付の違いを完全にサポートします
https://jsfiddle.net/b9chris/v5twbe3h/
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'); // 364
console.log(Math.floor(((b - a) % msDay) / msMinute) + ' full minutes between'); // 0
今いくつかの落とし穴。これを試して:
console.log(a - 10); // 1331614798990
console.log(a + 10); // mixed string
したがって、数値と日付を追加するリスクがある場合は、日付をnumber
直接変換してください。
console.log(a.getTime() - 10); // 1331614798990
console.log(a.getTime() + 10); // 1331614799010
私の最初の例は Date オブジェクトの力を示していますが、実際には時限爆弾のように見えます
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);
}
HTML コードの場合:
<div id="showTime"></div>
時間コンポーネントを気にしない場合は、 and を使用.getDate()
し.setDate()
て日付部分だけを設定できます。
終了日を開始日の 2 週間後に設定するには、次のようにします。
function GetEndDate(startDate)
{
var endDate = new Date(startDate.getTime());
endDate.setDate(endDate.getDate()+14);
return endDate;
}
2 つの日付の差 (日数) を返すには、次のようにします。
function GetDateDiff(startDate, endDate)
{
return endDate.getDate() - startDate.getDate();
}
最後に、最初の関数を変更して、2nd によって返される値をパラメーターとして受け取ることができるようにします。
function GetEndDate(startDate, days)
{
var endDate = new Date(startDate.getTime());
endDate.setDate(endDate.getDate() + days);
return endDate;
}
Thanks @Vincent Robert, I ended up using your basic example, though it's actually newBegin + oldEnd - oldBegin
. Here's the simplified end solution:
// 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));
}
必要に応じて、この関数は2日間の差を計算し、結果を小数の日数で返します。
// 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));
}
moment.js を使用している場合は、1 行のコードで日数の差が得られる、より単純なソリューションがあります。
moment(endDate).diff(moment(beginDate), 'days');
詳細については、moment.js ページを参照してください。
乾杯、ミゲル
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);
}
<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>
以下のコードは、今日から未来の日付までの残り日数を返します。
依存関係: jQuery および 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');
代替変更拡張コード..
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);
}
Date オブジェクトを使用し、getTime()
両方の日付に対してこの関数を使用すると、1970 年 1 月 1 日以降のそれぞれの時間が数値で示されます。次に、これらの数値の差を取得できます。
それでも問題が解決しない場合は、完全なドキュメントを確認してください: http://www.w3schools.com/jsref/jsref_obj_date.asp
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')
}
このコードは、学習の開始日と終了日 (認定取得日) を入力すると、学習年数を入力し、期間が 1 年未満かどうかを確認しますtxtFromQualifDate
。二番目txtQualifDate
と三番目txtStudyYears
年数の結果を小数で表示します
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;
}
}