タイムゾーンが問題になっているようです。Javascript日付機能クロムの日を減算する動作
私が変えた、明日徹底的にテストします:
var estimate = new Date(date+" 00:00:00 GMT-0500 (Eastern Standard Time)");
へ
var estimate = new Date(date+" 12:00:00 GMT-0500 (Eastern Standard Time)");
を==================== =========================
https://github.com/extant1/estimated-time/blob/master/estimated_time.html
私は私が作った小さなことでいくつかの問題を抱えています特定の日付から14週間を見積もる作業は、バニラJSとHTML5だけです。
html5とドロップダウンセレクタのクロムブラウザを使用して)日付は現在の日付として渡されますが、date()関数で日付を渡すと1日が減算されます。 Firefoxで同じことをすると(日付ドロップダウンボックスが機能しないので、手動で日付を入力する必要があります)、うまく動作します。手動クロムを選択更新の日付を追加し、ないページのロードには:編集
。
<html>
<head>
<title>estimate</title>
<style>
.current {
background-color: lightblue;
width: 260px;
}
.estimate {
background-color: lightcoral;
width: 260px;
}
#expTimeinWeeks {
width: 200px;
}
#date {
width: 200px;
}
#update {
width: 100%;
background-color: lightgreen;
}
.container {
background-color: gainsboro;
width: 260px;
}
</style>
</head>
<body>
<div class="container">
<table>
<tr>
<th class="current">Today</th>
</tr>
<tr>
<td class="current"><div id="today"></div></td>
</tr>
</table>
<br>
<form name="estimatedTime">
<table>
<tr>
<td>Weeks:</td>
<td><input type="text" maxlength=2 id="expTimeinWeeks" name="expTimeinWeeks" value=14></td>
</tr>
<tr>
<td>Date:</td>
<td><input type="date" name="date" id="date"></td>
</tr>
<table>
<input id="update" type="button" onclick="estimateDate(weeks=expTimeinWeeks.value, date=date.value); console.log('Form: ' + date.value);" value="Update"><br>
</form>
<br>
<table>
<tr>
<th class="estimate">Estimate</th>
</tr>
<tr>
<td class="estimate"><div id="expTime"></div></td>
</tr>
</table>
</div>
<script>
// Create function to change date.
function estimateDate(weeks=14, date=now) {
console.log("Input: " + date);
// create new variable 'estimate' with current date
var estimate = new Date(date);
console.log("Estimate: " + estimate);
// Convert to days
var inDays = weeks * 7
// Modify variable 'now' to be (current date time)+(expWeeks variable * 7)
estimate.setDate(estimate.getDate()+inDays);
console.log("Modified: " + estimate);
// Modify DOM 'expTime' with the updated date and return it.
return document.getElementById("expTime").innerHTML = estimate.toDateString();
};
// Set variable 'now' to the current date and time.
var now = new Date();
// Set variable 'expWeeks' to the time (in weeks) for an estimate from the text input "expTimeinWeeks"
var expWeeks = document.getElementById('expTimeinWeeks').value;
// Modify DOM 'today' with the current date and time.
document.getElementById("today").innerHTML = now.toDateString();
estimateDate(expWeeks, now);
</script>
</body>
</html>
コンソールログページのロードから:マニュアル日付の書式更新から
Input: Wed Dec 28 2016 00:12:08 GMT-0500 (Eastern Standard Time)
estimated_time.html:76 Estimate: Wed Dec 28 2016 00:12:08 GMT-0500 (Eastern Standard Time)
estimated_time.html:83 Modified: Wed Apr 05 2017 00:12:08 GMT-0400 (Eastern Daylight Time)
estimated_time.html:72
コンソールログ:
Input: 2016-12-28
estimated_time.html:76 Estimate: Tue Dec 27 2016 19:00:00 GMT-0500 (Eastern Standard Time)
estimated_time.html:83 Modified: Tue Apr 04 2017 19:00:00 GMT-0400 (Eastern Daylight Time)
estimated_time.html:57
Form: 2016-12-28
[mcve]に従って質問自体にすべての関連コードを掲載してください。質問は自己完結型でなければならず、問題を理解するために複数のリンクに移動する必要はありません。 – charlietfl
すべてのブラウザで同じ結果が得られます。 JSFiddle:https://jsfiddle.net/n5qm9pmh/ – EugeneZ
@charlietflコードを組み込むために投稿を更新しました。 – Scott