来自 <input type=date> 的 JavaScript 日期对象

Posted 2023-02-22

【中文标题】来自 <input type=date> 的 JavaScript 日期对象

【英文标题】：JavaScript date object from <input type=date>

【发布时间】：2014-07-01 17:36:25

【问题描述】：

我正在尝试在 focus.add_days 函数中创建一个 javascript 日期对象，以便为元素中的给定日期添加一些天数。 问题是 javascript 对象不需要字符串“Y-m-d”，那么如何在不将字符串“Y-m-d”解析成片段的情况下创建日期对象，或者是唯一的方法？

trigger = 
fecha_ini: function()
    $('input[name="fecha_ini"]').on('change',function()
      console.log('hi');
      var fecha_fin = $(':input [name=fecha_fin]');
      var min = $(this).val();
      //here is where i pass the "Y-m-d" string as the date argument
      var max = fechas.add_days(min,31*4);
      fecha_fin.attr('min',min);
      fecha_fin.attr('max',max);
      fecha_fin.val('');
    )
  
;

fechas = 
  add_days: function addDays(date, days) 
    //here is where i use the string "Y-m-d" to create the date object, but obviusly doesnt work
    var result = new Date(date);
    result.setDate(date.getDate() + days);
    return result;

;

trigger.fecha_ini();

【问题讨论】：

看看moment.js

【参考方案1】：

UTC

javascript Date 对象总是在 UTC 时区解析 <input type=date> 的原始值！

new Date(input.value) // Date object, date interpreted as UTC but printed in the local TZ
Date.parse(input.value) // Unix time in ms, date interpreted as UTC

当地时区

如果<input type=date> 的值要在本地时区中进行解释，那么您可以通过添加这样的时间来强制它：

new Date(input.value+"T00:00") // Date object, date interpreted and printed in the local TZ
Date.parse(input.value+"T00:00") // Unix time in ms, date interpreted as local TZ

为什么？

强调我的

例如，可以传递“2011-10-10”（仅日期形式）、“2011-10-10T14:48:00”（日期时间形式）或“2011-10-10T14:48:00.000+09:00”（日期时间形式，带有毫秒和时区）并将被解析。 当时区偏移不存在时，仅日期形式被解释为 UTC 时间，日期时间形式被解释为本地时间。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse#Description

【参考方案2】：

使用valueAsDate:

valueAsDate 返回：Date 返回/设置元素的值，解释为日期，如果无法转换，则返回 null。

演示：

<input type="date" id="d" value="2018-02-14">

<button onclick="console.log( document.getElementById('d').valueAsDate )">
change the date (or not) and click me
</button>

【参考方案3】：

Use valueAsNumber.

var myDate = new Date(input.valueAsNumber);

【参考方案4】：

对我来说，它无需做任何事情就可以工作。

我只是写 新日期($('#html5dateinput').val());

就是这样。我得到了正确的日期对象。我使用的是 Google Chrome 版本 38，并在 Ubuntu 14.04 下的 Firefox 33 上对其进行了测试

【讨论】：

这有非常不一致的结果。在 Chrome 上测试时，new Date("2017-10-19") 给出了正确的 GMT 日期，而new Date("2017-10-9") 给出了我自己时区的日期。

【参考方案5】：

如何在不将字符串“Y-m-d”解析成片段的情况下创建日期对象，或者是唯一的方法？

虽然 Date.parse 会将 y/m/d/ 格式的字符串转换为日期对象，但手动解析是唯一明智的方法：

// s is format y-m-d
// Returns a date object for 00:00:00 local time
// on the specified date
function parseDate(s) 
  var b = s.split(/\D/);
  return new Date(b[0], --b[1], b[2]);

ES5 指定了一个form of ISO 8601，所有浏览器都应该支持它，但它并没有得到一致的支持，也不是所有正在使用的浏览器都支持。

【讨论】：

谢谢，所以我认为我将不得不拆分文本，我只是想知道是否有更好的方法来解决这个问题。

我不敢相信这是正确的答案。为什么是 HTML5？！

@cgatian—"HTML5" is a buzword，它只是 HTML。 ;-) 由内置 Date 构造函数解析的 ISO 8601 格式日期将被视为 UTC，因此格林威治以西的用户可以看到前一天的日期。但是 HTML 希望它们被视为“本地”……去看看。