如何将日期输入和时间输入视为当地时间,而不是世界时间?

2024-03-22

用户输入的日期输入2019-12-22给出这些值:

  • input.value: "2019-12-22"
  • input.valueAsNumber: 1576972800000
  • input.valueAsDate: "Sat Dec 21 2019 16:00:00 GMT-0800 (Pacific Standard Time)"
    • 这个结果日期对象似乎是错误的
    • 当浏览器返回一个值时,它将用户输入视为世界时间
    • 因此日期对象的 utc 表示形式与输入显示给用户的内容相同
    • input.valueAsDate.getUTCDate()回报22,这是用户输入的内容
    • input.valueAsDate.getDate()回报21,不是用户输入的内容
    • 因此我们得出结论,日期输入显示并接受 UTC 时间,而不是本地时间

我们想要得到的结果date.toString()显示与日期输入中原始用户输入相同的结果

我们如何允许用户与当地时间交互,然后在脚本中获取正确的日期对象?


此问题是由 TC-39 决定将仅限日期的 ISO 8601 格式时间戳视为 UTC 引起的,而与 ISO 8601 保持一致并将其视为本地时间戳更为合乎逻辑。看为什么 Date.parse 给出不正确的结果? https://stackoverflow.com/questions/2587345/why-does-date-parse-give-incorrect-results

简单的解决方案是手动解析字符串,不要使用内置解析器,作为至少一种当前实现,直到最近将 YYYY-MM-DD 解析为本地。另外,请勿使用当前时区偏移量来调整时间值,因为这不允许偏移量的历史变化或可能的夏令时变化。

// Parse timestamp in YYYY-MM-DD format as local
function parseISOLocal(s) {
  let [y, m, d] = s.split(/\D/);
  return new Date(y, --m, d);
}

// Format date as YYYY-MM-DD local
function formatISOLocal(d) {
  let z = n => (n<10?'0':'') + n;
  return d.getFullYear() + '-' + z(d.getMonth()+1) + '-' + z(d.getDate());
}

let s = '2019-12-22';
let d = parseISOLocal(s);
console.log( d.toString());
console.log( formatISOLocal(d));

Edit

在支持输入类型日期且 YYYY-MM-DD 按 ECMA-262 解析为 UTC 的情况下,您可以使用值作为日期和 UTC 方法。但是,并非所有浏览器都支持输入类型日期,并且并非所有解析器都会将该格式解析为 UTC。

不依赖输入类型日期并手动解析值、检查格式和有效性要可靠得多。这是通常使用日期小部件和库而不是内置日期功能的原因之一。

let inp = document.getElementById('dob');
let dobObj = inp.valueAsDate;
let dobStr = inp.value;

console.log('Value as date: ' + dobObj);   // Safari: null
console.log('Value as string: ' + dobStr); // 2018-06-15
<input id="dob" type="date" value="2018-06-15">
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何将日期输入和时间输入视为当地时间,而不是世界时间? 的相关文章

随机推荐

  • 如何对链表进行排序?

    我有一个链接列表 我想按特殊顺序对其进行排序 我尝试使用冒泡排序 由于我的结构 称为 Node 中有许多数据类型 因此我无法交换这些值 struct Node int data Node next Node int x data x nex
  • 桌面组合被禁用错误

    在我的 NET 4 0 上的 WPF 应用程序中 我让用户报告两个错误 这些错误似乎非常间歇性 我无法处理 下面 我发布了消息和堆栈跟踪的最上面一行 如果需要 我可以发布完整的堆栈跟踪 Message Desktop composition
  • Android:检查我的应用程序是否允许运行后台活动

    我有一个运行秒表服务的应用程序 并且我在前台运行该服务 我有一个显示计时器的通知 每秒更新一次 在我离开应用程序 30 秒后 通知停止更新 我发现原因是我的设备的电池优化 在我的应用程序的系统设置中 有一个电池优化部分 其中包含一个名为Al
  • WebSphere - 无法加载 Logmanager“org.apache.logging.log4j.jul.LogManager”

    我有一个运行 Web 应用程序的 WebSphere 应用程序服务器 我从 Eclipse 启动服务器 该应用程序中的主要日志记录框架是 log4j2 但也有一些使用 java util logging 的第三方库 我想将这些日志重定向到
  • 取消选中单选按钮[重复]

    这个问题在这里已经有答案了 该应用程序是一个步进音序器应用程序 具有 16 个无线电组 每组有 8 个按钮 它工作得很好 除非一个组选择了一个按钮 否则我无法将其关闭 除非我使用我创建的清除按钮来清除所有无线电组 我想添加的是一些代码 它表
  • Go:是否有可以在模板内使用的模数

    我的问题如标题所述 我正在尝试做类似的事情 range index element Products if index 4 0 div class row end div class columns small 3 product img
  • GitLab CI 启用 SCP

    我目前正在使用 GitLab com 上的共享运行器之一 是否可以设置 gitlab ci yaml 文件 以便构建可以将 SCP 文件从远程服务器传输到运行器上 我的目标是 SCP 文件 这些文件是我的构建所必需的依赖项 但它们不会在任何
  • C 数组中的指针递增

    我试图理解下面的程序 具体来说 定义cur name以及指针的递增cur age在 printf 语句中 cur age i 必须索引数组中的每个整数 但我希望它指向内存中的连续地址 而不是给定 int 的下一个整数是 4 个字节 即为什么
  • ASP.NET MVC:可用路由数据的 Uri

    我的问题很简单 我有一个 Uri 我想弄清楚它映射到哪个路由 这样我就可以对路由的各个部分进行一些检查 控制器 操作等 如何从 Uri 转到 RouteData 或 Route 根据 tvanfosson 的指导 我想出了一个可以满足我需要
  • 测试 Bash 函数返回值的正确方法是什么?

    我想测试 Bash 函数的返回值if像这样的声明 if func arg then 但我收到如下错误消息 conditional binary operator expected 这样做的正确方法是什么 是下面这个吗 if func arg
  • 字符串未被识别为有效的日期时间

    我收到此错误 字符串未被识别为有效的日期时间 代码如下 DateTimeOffSet dt new DateTimeOffset Convert ToDateTime DateTime Now ToString dd MM yyyy hh
  • 使用 Service Worker 和推送通知做出反应

    一些初步考虑 react 16 8 2 react scripts 2 1 5 我创建了一个新的反应应用程序 我需要实现推送通知 下列的this https developers google com web fundamentals co
  • Go 保证地址不变吗?

    给定一个对象obj有保证吗 uintptr unsafe Pointer obj 无论何时调用 都会计算出相同的值 当然 Go 保证如果你使用两个指向同一个对象的指针 它们总是比较相等 不过 实现可能会移动内存中的对象并透明地更新指向它的所
  • 什么是会话和会话变量?

    您能指导我什么是会话和会话变量吗 我不需要比较 ASP 会话和 ASP NET 会话 因为我对 ASP 一无所知 我也看过很多关于会话类型的文章 但我仍然无法正确理解 ASP NET 中什么是会话以及什么是会话变量 会话 是跟踪每个用户的请
  • PHP:Html 以 html 格式发送电子邮件

    我正在遵循教程http css tricks com sending nice html email with php http css tricks com sending nice html email with php 以 html
  • 获取 RFECV scikit-learn 中的功能

    受此启发 http scikit learn org stable auto examples feature selection plot rfe with cross validation html sphx glr auto exam
  • 如何在 Rails 3.1 中初始化 ActionDispatch::ParamsParser?

    我的应用程序为其 Rest 接口定义了一个自定义 Mime 类型 所以我将其注册在mime types rb初始化器 Mime Type register application vnd example app v1 xml xml v1
  • 当所有线程完成时

    这是我第一次真正尝试使用多线程 我想知道如何判断所有任务组何时完成运行 for int i 0 i lt taskGroups Count i ThreadStart t delegate RunThread taskGroups i ne
  • 自定义 jQuery-File-Upload(基本插件)

    我碰到jQuery 文件上传 https github com blueimp jQuery File Upload在谷歌搜索中 我发现它很简洁 正是我所需要的 但我遇到了一个小问题 即使用基本插件按照我希望的方式获取几个功能 我认为基本插
  • 如何将日期输入和时间输入视为当地时间,而不是世界时间?

    用户输入的日期输入2019 12 22给出这些值 input value 2019 12 22 input valueAsNumber 1576972800000 input valueAsDate Sat Dec 21 2019 16 0