【发布时间】:2016-12-28 00:32:21
【问题描述】:
时区似乎是个问题。
我变了,明天彻底测试:
var estimate = new Date(date+" 12:00:00 GMT-0500 (Eastern Standard Time)");
到
var estimate = new Date(date+" 00:00:00 GMT-0500 (Eastern Standard Time)");
==============================================
https://github.com/extant1/estimated-time/blob/master/estimated_time.html
我为工作而做的一件小事遇到了一些麻烦,估计从特定日期开始需要 14 周,它只是普通的 JS 和 HTML5。
使用 html5 和 chrome 浏览器作为下拉日期选择器)日期作为当前日期传递,但是一旦我通过 date() 函数传递一个日期,它就会减去一天。如果我在 Firefox 上做同样的事情(日期下拉框不起作用,所以你必须手动输入日期)它工作得很好。
编辑:当您在 chrome 中手动添加日期并选择更新时,不是页面加载时。
<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
【问题讨论】:
-
按照minimal reproducible example在问题本身中发布所有相关代码。问题应该是自包含的,我们不应该离开网站去多个链接来试图找出你的问题
-
我在所有浏览器中都得到了相同的结果。 JSFiddle:jsfiddle.net/n5qm9pmh
-
@charlietfl 更新了帖子以包含代码。
-
@EugeneZ 在页面加载时工作正常,只有在尝试通过函数传递日期并选择更新时。更新功能也不适用于 jsfiddle。
-
与Why does Date.parse give incorrect results? 重复,注意 Date 构造函数和 Date.parse 对于解析是等效的,并且 Date 输入返回 ISO 中的值8601 格式。
标签: javascript html google-chrome date