【问题标题】:Javascript Date function behavior subtracting day in chromeJavascript日期函数行为减去chrome中的日期
【发布时间】: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 中手动添加日期并选择更新时,不是页面加载时。

reddit link

<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


【解决方案1】:

您遇到了时区不一致的问题。对于美国,初始日期new Date('2016-12-27') 将在 UTC 午夜 12/27/16 或前一天晚上的某个时间变为 12/27/16。这就是你失去一天的地方。

【讨论】:

  • 这似乎是目前测试中的问题。
  • 现在您知道了,您需要 javascript 日期函数的帮助来解决这个问题吗?
猜你喜欢
  • 2015-08-04
  • 2018-10-24
  • 1970-01-01
  • 1970-01-01
  • 2022-01-23
  • 2012-08-21
  • 1970-01-01
  • 2022-01-21
  • 1970-01-01
相关资源
最近更新 更多