如何通过jQuery设置datetime-local上的日期时间

How to set datetime on datetime-local via jQuery

本文关键字：日期 时间 datetime-local 何通过 jQuery 设置      更新时间：2023-09-26

我有datetime-local html控件在我的形式，我需要通过JS或jQuery动态设置日期和时间。我该怎么做呢?

<input type="datetime-local" id="publishDate" required/>

我试着

$("#publishDate").val("2013-3-18 13:00");
$("#publishDate").val("2013-3-18T13:00");
$("#publishDate").val(new Date().toLocalString());

这就行了

$("#publishDate").val("2013-03-18T13:00");

您需要使用2个数字的月份，使您的示例工作

如果您想设置当前日期，那么您可以尝试:

__Method 1:__
$(document).ready(function(){
    $('input[type=datetime-local]').val(new Date().toJSON().slice(0,19));
});
__Method 2:__
function zeroPadded(val) {
  if (val >= 10)
    return val;
  else
    return '0' + val;
}
$(document).ready(function(){
  d = new Date();
  $('input[type=datetime-local]').val(d.getFullYear()+"-"+zeroPadded(d.getMonth() + 1)+"-"+zeroPadded(d.getDate())+"T"+d.getHours()+":"+d.getMinutes()+":"+d.getSeconds());
});

备注:您可以将$('input[type=datetime-local]')替换为datetime-local字段的Id或Name或Class。

EDIT: d.getMonth()返回0-11之间的值，因此要输入正确的月份，需要在结果中添加1。

为什么?

var now=new Date();
console.log(new Date(now.getTime()-now.getTimezoneOffset()*60000).toISOString().substring(0,19));

我编写了一个jQuery方法来设置当前的UTC时间。对于初始化datetime和datetime-local输入字段非常有用。

下面是你如何使用它来初始化一个字段:

$('input[type="datetime"]').setNow();

或者传递一个参数true，只设置没有值的字段。

$('input[type="datetime"]').setNow(true);

这是一个使用momentjs格式化日期的解决方案。
这将获得当前日期和时间

moment().format('YYYY-MM-DDThh:mm:ss.SSS')

这里有一个更简单的方法。

const now = (new Date().toLocaleString("sv-SE") + '').replace(' ','T');
console.log(now);

这个组件搞砸了，因为它还没有被正确指定。实现也可能很古怪。

正确的方法应该是传递一个日期对象，在JS和DOM中，没有这个是没有意义的。使用字符串操作会调用Zalgo。它迟早会与区域设置或时区断开。

我一直在寻找这样的东西，并在Chrome 46中发现:

$('input[type=datetime-local]').prop('valueAsNumber', Math.floor(new Date() / 60000) * 60000); // 60seconds * 1000milliseconds

如果你不删除秒和毫秒，它们将显示在输入字段。

也有一个valueAsDate属性，但是很神秘:

Uncaught DOMException: Failed to set the 'valueAsDate' property on 'HTMLInputElement': This input element does not support Date values.

所以他们还没有完成它的实现，或者为这个属性选择了一个不好的名字(即使设置了一些东西，它也显示为null)。

使用带有"T"中间字符，
将10个字符(空格)替换为T
代码如下:

function setCharAt(str,index,chr) {
    if(index > str.length-1) return str;
    return str.substring(0,index) + chr + str.substring(index+1);
}
var variable=setCharAt("2022-02-26 16:32",10,"T");
$("#publishDate").val(variable);

，但请记住格式必须为"YYYY-MM-DDThh:mm:ss"
OP错误地提供了日期"2013-3-18t13:00";
其中月份应该是"03"

使用moment，您可以执行以下操作:

  1. 如果您想使用当前日期。

    $("# publishDate" .val(时刻().format (YYYY-MM-DDTHH: MM));

  2. 如果您有一个指定的日期。

    $("# publishDate" .val(时刻(你).format (YYYY-MM-DDTHH: MM));

相关文章：