如何设置输入类型日期的默认值为今天?

给定一个输入元素:

<input type="date" />

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

当前回答

JavaScript Date对象为所需的格式提供了足够的内置支持，以避免手动执行:

添加这个以获得正确的时区支持:

Date.prototype.toDateInputValue = (function() {
    var local = new Date(this);
    local.setMinutes(this.getMinutes() - this.getTimezoneOffset());
    return local.toJSON().slice(0,10);
});

jQuery:

$(document).ready( function() {
    $('#datePicker').val(new Date().toDateInputValue());
});

纯JS：

document.getElementById('datePicker').value = new Date().toDateInputValue();

2012-10-24 15:16:22

其他回答

即使过了这么久，这也能帮到别人。这是一个简单的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"  />

2019-12-04 17:08:23

最简单的解决方案似乎忽略了将使用UTC时间，包括高度赞成的解决方案。下面是一个精简的，ES6，非jquery版本的一对现有的答案:

const today = (function() {
    const now = new Date();
    const month = (now.getMonth() + 1).toString().padStart(2, '0');
    const day = now.getDate().toString().padStart(2, '0');
    return `${now.getFullYear()}-${month}-${day}`;
})();

console.log(today);  // as of posting this answer: 2019-01-24

2019-01-24 07:23:02

这将返回与ISO相同的YYYY-MM-DD格式，但是您的本地时间，而不是UTC。

function getToday() {
    return new Date().toLocaleDateString('en-CA', {
        year: 'numeric',
        month: '2-digit',
        day: '2-digit'
    });
}

2021-11-15 01:34:05

由于没有将值设置为今天日期的默认方法，所以我认为这应该取决于它的应用程序。如果您希望最大限度地让受众了解日期选择器，那么可以使用服务器端脚本(PHP、ASP等)设置默认值。

但是，如果它是用于CMS的管理控制台，并且您知道用户将始终在站点上使用JS或您的站点受信任，那么您可以安全地使用JS填充默认值，根据jlbruno。

2011-08-08 16:23:34

这就是我在我的代码中所做的，我刚刚测试过，它工作得很好，输入类型="date"不支持自动设置curdate，所以我用来克服这个限制的方法是使用PHP代码一个简单的代码，像这样。

<html>
<head></head>
    <body>
        <form ...>
            <?php
                echo "<label for='submission_date'>Data de submissão</label>";
                echo "<input type='date' name='submission_date' min='2012-01-01' value='" . date('Y-m-d') . "' required/>";
            ?>
        </form>
    </body>
</html>

希望能有所帮助!

2014-05-28 12:47:18

如何设置输入类型日期的默认值为今天?

推荐文章

最新文章

标签