给定一个输入元素:

<input type="date" />

有没有办法将日期字段的默认值设置为今天的日期?


当前回答

未来证明的解决方案,也是.split("T")[0]的替代方案,它不会在内存中创建字符串数组,将使用string .slice(),如下所示:

new Date().toISOString().slice(0, -14);

这里给出的很多答案,比如slice(0,10), substring(0,10)等,将来都将失败。 他们使用Date.toJSON()返回Date.toISOString():

toISOString()方法返回一个简化扩展ISO格式(ISO 8601)的字符串,它总是24或27个字符长(YYYY-MM-DDTHH:mm:ss)。sssZ或±YYYYYY-MM-DDTHH:mm:ss。分别为sssZ)。时区始终是零UTC偏移量,由后缀“Z”表示。

一旦年份变成5位数,这些答案就会失败。

datePickerId。value = new Date(). toisostring()。片(0,-14); <input type="date" id="datePickerId" />

其他回答

在HTML本身中没有将今天的日期插入到输入字段的默认方法。然而,像任何其他输入字段一样,它将接受一个值。

您可以使用PHP获取今天的日期,并将其输入到表单元素的值字段中。

<?php
    // Fetch the year, month and day
    $year = date(Y);
    $month = date(m);
    $day = date(d);

    // Merge them into a string accepted by the input field
    $date_string = "$year-$month-$day";

    // Send to the browser the input field with the value set with the date string
    echo "<input type='date' value='$date_string' />";
?>

value字段接受YYYY-MM-DD格式作为输入,因此只需创建一个与输入值接受的格式相同的变量$date_string,并用从今天的日期和voilá获取的年、月和日填充它!你有一个预先选择的日期!

希望这对你有所帮助。

编辑:

如果希望输入字段嵌套在HTML而不是PHP中,可以执行以下操作。

<?php
    // Fetch the year, month and day
    $year = date(Y);
    $month = date(m);
    $day = date(d);

    // Merge them into a string accepted by the input field
    $date_string = "$year-$month-$day";
?>
<html>
    <head>...</head>
    <body>
        <form>
            <input type="date" value="<?php print($date_string); ?>" />
        </form>
    </body>
</html>

我意识到这个问题是在很久以前(2年前)被问过的,但我仍然花了一段时间在互联网上找到一个明确的答案,所以这篇文章适用于任何正在寻找答案的人,希望它能极大地帮助每个人:)

另一个编辑:

几乎忘记了,过去对我来说非常痛苦的事情是总是忘记设置默认时区,无论何时在PHP中使用date()函数编写脚本。

语法为date_default_timezone_set(…);。可以在PHP.net上找到相关文档,可以在这里找到要插入函数的支持时区列表。这总是很烦人,因为我在澳大利亚,如果我没有正确设置,一切总是向后推10个小时,因为它默认为UTC+0000,我需要UTC+1000,所以要小心:)

$(document).ready(function(){
  var date = new Date();

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

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

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

即使过了这么久,这也能帮到别人。这是一个简单的JS解决方案。

JS

  let date = new Date();
  let today = date.toISOString().substr(0, 10);
  //console.log("Today: ", today);//test
  document.getElementById("form-container").innerHTML =
    '<input type="date" name="myDate" value="' + today + '" >';//inject field

HTML

 <form id="form-container"></form>

类似的解决方案也适用于Angular,无需任何额外的库来转换日期格式。对于Angular(由于通用组件代码,代码被缩短了):

//so in myComponent.ts 
//Import.... @Component...etc...
date: Date = new Date();
today: String; //<- note String
//more const ...
export class MyComponent implements OnInit {
   //constructor, etc.... 
   ngOnInit() {
      this.today = this.date.toISOString().substr(0, 10);
   }
}
//so in component.html 
<input type="date" [(ngModel)]="today"  />

如果你正在使用ruby,你可以使用这个来设置默认值为今天的日期和时间:

<input type="datetime-local" name="time" value="<%= Time.now.strftime('%Y-%m-%dT%H:%M') %>" />

HTML

<input type="date" id="theDate">

JQuery

$(document).ready(function() {
    var date = new Date();

    var day = date.getDate();
    var month = date.getMonth() + 1;
    var year = date.getFullYear();

    if (month < 10) month = "0" + month;
    if (day < 10) day = "0" + day;

    var today = year + "-" + month + "-" + day +"T00:00";       
    $("#theDate").attr("value", today);
});

demo

如果你不想使用jQuery,你可以这样做

JS

var date = new Date();

var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear();

if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;

var today = year + "-" + month + "-" + day;       
document.getElementById("theDate").value = today;

demo

TS

const date = new Date()
const year = date.getFullYear()

let month: number | string = date.getMonth() + 1
let day: number | string = date.getDate()

if (month < 10) month = '0' + month
if (day < 10) day = '0' + day

const today = `${year}-${month}-${day}`    
document.getElementById("theDate").value = today;