在输入类型日期中设置日期

Question

<input id="datePicker" type="date" />?

我将在chrome中设置datepicker输入类型日期的今天日期.

$(document).ready( function() {
    var now = new Date();
    var today = now.getDate()  + '/' + (now.getMonth() + 1) + '/' + now.getFullYear();
    alert(today);
    $('#datePicker').val(today);
});?

但它不起作用

编辑此jsFiddle - 请尝试使用chrome.

Answer 1

小提琴链接:http://jsfiddle.net/7LXPq/93/

这有两个问题:

1. HTML 5中的日期控件以我们在SQL中使用的年 - 月 - 日的格式接受
2. 如果月份为9,则需要将其设置为09而不是9.所以它也适用于日间领域.

请按照小提琴链接进行演示:

var now = new Date();

var day = ("0" + now.getDate()).slice(-2);
var month = ("0" + (now.getMonth() + 1)).slice(-2);

var today = now.getFullYear()+"-"+(month)+"-"+(day) ;

$('#datePicker').val(today);

Answer 2

document.getElementById("datePicker").valueAsDate = new Date()

应该管用.

Answer 3

更新:我正在这样做date.toISOString().substr(0, 10).给出与接受的答案相同的结果,并得到很好的支持.

Answer 4

对我来说,解决这个问题的最简单方法是使用moment.js并在2行中解决这个问题.

var today = moment().format('YYYY-MM-DD');
$('#datePicker').val(today);

Answer 5

var today = new Date().toISOString().split('T')[0];
$("#datePicker").val(today);

上面的代码将起作用。

Answer 6

如果采用以下格式YYYY-MM-DD，您的代码会起作用：，这是日期格式的计算机标准http://en.wikipedia.org/wiki/ISO_8601

Answer 7

我通常在使用日期输入时创建这两个辅助函数：

// date is expected to be a date object (e.g., new Date())
const dateToInput = date =>
  `${date.getFullYear()
  }-${('0' + (date.getMonth() + 1)).slice(-2)
  }-${('0' + date.getDate()).slice(-2)
  }`;

// str is expected in yyyy-mm-dd format (e.g., "2017-03-14")
const inputToDate = str => new Date(str.split('-'));

然后您可以将日期输入值设置为：

$('#datePicker').val(dateToInput(new Date()));

并像这样检索选定的值

const dateVal = inputToDate($('#datePicker').val())

Answer 8

您只能type="date"按照格式在输入中使用日期YYYY-MM-DD

我已经实现了formatDateNODE.js express-handlebars 中的帮助程序，不必担心......只需使用第一行中描述的格式即可。

例如：

< input type="date" id="date" name="date" class="form-control" value="{{formatDate invoice.date 'YYYY-MM-DD'}}" />

Answer 9

2021年

我发现做到这一点的一个好方法是使用区域设置进行格式化。您可以通过多种不同方式使用它。当您不使用 jquery 日期选择器而是使用 html 日期选择器时，这适用于。

  $("#datepickerEnd").val(new Date().toLocaleDateString('en-CA'));//YYYY-MM-dd

或者分开进行操作、调整或其他用途。

let theDate = new Date();
  $("#datepickerEnd").val(theDate.toLocaleDateString('en-CA'));//YYYY-MM-dd

操纵示例。

  theDate.setDate(theDate.getDate()-7);
  $("#datepickerStart").val(theDate.toLocaleDateString('en-CA'));//YYYY-MM-dd

“en-ca”是我的日期选择器所需的格式。如果您的不同，您可以查找匹配的字符串格式。由于它将其转换为字符串，因此它不包含弄乱每个区域的额外信息。因此，通过这种方式，您可以将其用于纯粹的格式化。

了解更多信息

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