新的HTML5输入类型很棒.Opera的新内置日期选择器是轻而易举的,Chrome至少支持带有旋转轮实现的新输入类型.
但有没有办法将日期字段的默认值设置为今天的日期？使用Opera,我可以从日期选择器中选择"今天",只要我点击Chrome中的任一步骤按钮,它就会从今天的日期开始递增/递减.
我并不羞于编写这个小问题的解决方案,但对我来说,两个浏览器都完全了解当前日期但不会自动将其弹出(至少作为占位符)似乎很愚蠢.
Tak*_*Tak 255
与任何HTML输入字段一样,除非使用该value属性指定默认值,否则浏览器将为空.
不幸的是,HTML5没有提供在value属性中指定'today'的方法(我可以看到),只有RFC3339的有效日期2011-09-29.对不起,这没有多大帮助!
bri*_*ary 206
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();
And*_*dré 170
这对我有用:
document.getElementById('datePicker').valueAsDate = new Date();
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement
小智 76
以下代码运行良好:
<input type="date" value="<?php echo date('Y-m-d'); ?>" />
请注意,这依赖于PHP.
Jef*_*eff 35
您可以通过javascript填充默认值,如下所示:http: //jsfiddle.net/7LXPq/
$(document).ready( function() {
var now = new Date();
var month = (now.getMonth() + 1);
var day = now.getDate();
if (month < 10)
month = "0" + month;
if (day < 10)
day = "0" + day;
var today = now.getFullYear() + '-' + month + '-' + day;
$('#datePicker').val(today);
});
我可能会花一些额外的时间来查看月份和日期是否为单位数字,并在前面加上额外的零...但这应该会给你一个想法.
编辑:添加了额外零的检查
Shu*_*man 29
如果您使用的是PHP,请遵循标准的Ymd格式
<input type="date" value="<?php echo date("Y-m-d"); ?>">
小智 21
HTML
<input type="date" id="theDate">
JS
$(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;
$("#theDate").attr("value", today);
});
如果你不想使用jQuery,你可以做这样的事情
HTML
<input type="date" id="theDate">
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;
Juk*_*ela 21
在HTML5中,没有办法将日期字段的默认值设置为今天的日期？如其他答案所示,可以使用JavaScript设置该值,如果您希望根据加载页面时用户的当前日期设置默认值,这通常是最佳方法.
HTML5定义元素的valueAsDate属性input type=date,并使用它,您可以直接从创建的对象设置初始值,例如new Date().但是,例如IE 10不知道该属性.(它也缺乏真正的支持input type=date,但这是一个不同的问题.)
所以在实践中你需要设置value属性,它必须符合ISO 8601标准.现在这可以很容易地完成,因为我们可以期待当前使用的浏览器支持该toISOString方法:
<input type=date id=e>
<script>
document.getElementById('e').value = new Date().toISOString().substring(0, 10);
</script>
Gab*_*cia 17
如果您在浏览器中执行与日期和时间相关的任何操作,则需要使用Moment.js:
moment().format('YYYY-MM-DD');
moment()返回表示当前日期和时间的对象.然后,您可以调用其.format()方法以根据指定的格式获取字符串表示形式.在这种情况下,YYYY-MM-DD.
完整示例:
<input id="today" type="date">
<script>
document.getElementById('today').value = moment().format('YYYY-MM-DD');
</script>
小智 9
通过应用以下代码，这非常简单，使用 PHP
<input type="date" value="<?= date('Y-m-d', time()); ?>" />
日期函数将返回当前日期，通过在time().
使用moment.js来解决这个问题的2行,html5日期输入类型只接受"YYYY-MM-DD"这种格式.我这样解决了我的问题.
var today = moment().format('YYYY-MM-DD');
$('#datePicker').val(today);
这是解决此问题的最简单方法.
我测试过的最简单的工作版本：
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="date" id="date" name="date">
<script>
$('#date').val(new Date().toJSON().slice(0,10));
</script>非常简单,只需使用PHP,ASP,JAVA等服务器端语言,甚至可以使用javascript.
这是解决方案
<?php
$timezone = "Asia/Colombo";
date_default_timezone_set($timezone);
$today = date("Y-m-d");
?>
<html>
<body>
<input type="date" value="<?php echo $today; ?>">
</body>
</html>
小智 6
<input id="datePicker" type="date" />
<input id="datePicker" type="date" />
$(document).ready( function() {
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);
});Both top answers are incorrect.
A short one-liner that uses pure JavaScript, accounts for the local timezone and requires no extra functions to be defined:
const element = document.getElementById('date-input');
element.valueAsNumber = Date.now()-(new Date()).getTimezoneOffset()*60000;<input id='date-input' type='date'>This gets the current datetime in milliseconds (since epoch) and applies the timezone offset in milliseconds (minutes * 60k minutes per millisecond).
You can set the date using element.valueAsDate but then you have an extra call to the Date() constructor.
最简单通用的答案：
<input type="date" value="2020-12-31">
PHP回答：
<input type="date" value="<?= date('Y-m-d') ?>">
日期格式应始终为“ yyyy-mm-dd ”
小智 6
一行JS就可以实现。
HTML：
<input type="date" id="theDate">
JS：
document.getElementById('theDate').value = new Date().toISOString().substring(0, 10);
<input type="date" id="theDate">
document.getElementById('theDate').value = new Date().toISOString().substring(0, 10);
小智 5
如果您需要填写输入日期时间，您可以使用：
<input type="datetime-local" name="datetime"
value="<?php echo date('Y-m-d').'T'.date('H:i'); ?>" />
<input type="date" id="aDate" name="aDate" class="form-control" value="{{ Date.now() | date("Y-m-d") }}" />
最简单的解决方案似乎忽略了将使用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
Java脚本
document.getElementById('date-field').value = new Date().toISOString().slice(0, 10);
jQuery的
$('#date-field').val(new Date().toISOString().slice(0, 10));
另外一个选项
如果要自定义日期，月份和年份，请按照自己的意愿进行求和或求和。对于从表0开始的月份，这就是为什么需要对月份求和1的原因。
function today() {
let d = new Date();
let currDate = d.getDate();
let currMonth = d.getMonth()+1;
let currYear = d.getFullYear();
return currYear + "-" + ((currMonth<10) ? '0'+currMonth : currMonth )+ "-" + ((currDate<10) ? '0'+currDate : currDate );
}
应用今日功能
document.getElementById('date-field').value = today();
$('#date-field').val(today());
| 归档时间： |
|
| 查看次数： |
709099 次 |
| 最近记录： |