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

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

i will set today date in datepicker input type date in chrome.

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

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

but it's not working

但它不起作用

Edit This jsFiddle - Please try in chrome.

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

8 个解决方案

#1

105

Fiddle link : http://jsfiddle.net/7LXPq/93/

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

Two problems in this:

这有两个问题：

Date control in HTML 5 accepts in the format of Year - month - day as we use in SQL
HTML 5中的日期控件接受我们在SQL中使用的年 - 月 - 日格式
If the month is 9, it needs to be set as 09 not 9 simply. So it applies for day field also.
如果月份为9，则需要将其设置为09而不是9。因此它也适用于日间场。

Please follow the fiddle link for demo:

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

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);

#2

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

document.getElementById（“datePicker”）。valueAsDate = new Date（）

should work.

应该管用。

#3

Update: I'm doing this with date.toISOString().substr(0, 10). Gives the same result as the accepted answer and has good support.

更新：我正在使用date.toISOString（）。substr（0,10）。给出与接受的答案相同的结果，并得到良好的支持。

#4

to me the shortest way to solve this problem is to use moment.js and solve this problem in just 2 lines.

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

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

#5

Your code would have worked if it had been in this format: YYYY-MM-DD, this is the computer standard for date formats http://en.wikipedia.org/wiki/ISO_8601

如果采用这种格式，你的代码就可以了：YYYY-MM-DD，这是日期格式的计算机标准http://en.wikipedia.org/wiki/ISO_8601

#6

I usually create these two helper functions when using date inputs:

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

// 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('-'));

You can then set the date input value as:

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

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

And retrieve the selected value like so

并检索所选的值

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

#7

Datetimepicker always needs input format YYYY-MM-DD, it doesn't care about display format of your model, or about you local system datetime. But the output format of datetime picker is the your wanted (your local system). There is simple example in my post.

Datetimepicker始终需要输入格式YYYY-MM-DD，它不关心模型的显示格式，也不关心本地系统日期时间。但是日期时间选择器的输出格式是您想要的（您的本地系统）。我的帖子中有一个简单的例子。

#8

-2

Jquery version

Jquery版本

var currentdate = new Date();

$('#DatePickerInputID').val($.datepicker.formatDate('dd-M-y', currentdate));

#1

105