我正在使用以下输入内容:
<input id="creation-from-date" type="datetime-local"/>
我想知道是否可以通过以下方式设置默认时间: dd / mm / yyyy 00:00
因为日期选择器只允许选择日期,而不是时间,所以我在JS端得到的日期无效,因为未设置小时数。
我正在使用Chrome v73.0.3683.75
非常感谢!
答案 0 :(得分:1)
我将改用<input type='date' />
和<input type='time' />
:
//<![CDATA[
/* external.js */
var doc, bod, I, DateTime; // for use on other loads
addEventListener('load', function(){
doc = document; bod = doc.body;
I = function(id){
return doc.getElementById(id);
}
DateTime = function(dateElement, timeElement, dateInstance){
var t = this;
this.dateElement = dateElement; this.timeElement = timeElement;
this.date = dateInstance instanceof Date ? dateInstance : new Date;
this.dateValue = function(dateInstance){
if(dateInstance instanceof Date)this.date = dateInstance;
var dt = this.date;
return dt.getFullYear()+'-'+(dt.getMonth()+1).toString().replace(/^(\d)$/, '0$1')+'-'+dt.getDate().toString().replace(/^(\d)$/, '0$1');
}
this.showDate = function(dateInstance){
this.dateElement.value = this.dateValue(dateInstance);
return this;
}
this.timeValue = function(dateInstance){
if(dateInstance instanceof Date)this.date = dateInstance;
var dt = this.date;
return dt.getHours().toString().replace(/^(\d)$/, '0$1')+':'+dt.getMinutes().toString().replace(/^(\d)$/, '0$1');
}
this.showTime = function(dateInstance){
this.timeElement.value = this.timeValue(dateInstance);
return this;
}
this.showDate().showTime();
this.dateChange = function(changeFunc, noTimeFunc){
this.dateElement.oninput = function(){
var v = this.value, s = t.timeElement.value;
if(v === '')v = this.value = t.dateValue(noTimeFunc(t));
if(s === '')s = t.timeValue(this.date);
t.date = new Date(v+' '+s); changeFunc(t.date, t);
}
return this;
}
this.timeChange = function(changeFunc, noTimeFunc){
this.timeElement.oninput = function(){
var v = this.value, s = t.dateElement.value;
if(v === '')v = this.value = t.timeValue(noTimeFunc(t));
if(s === '')s = t.dateValue(this.date);
t.date = new Date(s+' '+v); changeFunc(t.date, t);
}
return this;
}
}
var dateElement = I('date'), timeElement = I('time');
function threeHoursLater(){
return new Date(Date.now()+10800000);
}
var dt = new DateTime(dateElement, timeElement, threeHoursLater()); // 3 hours from now - initial date time set
function consoleIt(dateInstance){
console.log('display of dt.date --> '+dateInstance.toString());
console.log('dt.date for server --> '+dateInstance.getTime());
}
consoleIt(dt.date);
dt.dateChange(function(r){
consoleIt(r);
}, threeHoursLater).timeChange(function(a){
consoleIt(a);
}, threeHoursLater);
}); // end load
//]]>
<input id='date' type='date' />
<input id='time' type='time' />
关闭这些输入,看看会发生什么!哦,请确保您在服务器上验证了这些日期。客户端可以更改。
我已经更新了上面的代码,以包含一个DateTime
构造函数。参数应该清楚。
PS
我注意到Firefox 67.0(64位)在没有首先获得焦点的Elements上存在更改事件的问题,因此.onchange
更改为.oninput
,这似乎可行全面。
答案 1 :(得分:0)
您可以尝试使用Javascript日期:
$("creation-from-date").val(new Date().toLocalString());
// toLocalString() will return the local time while toISOString() will return the UTC time.
这里有一个不错的jQuery extension,对于初始化datetime
和datetime-local
输入非常有用:
// To initialize, simply call the method:
$('input[type="datetime-local"]').setNow();
希望这会有所帮助。
答案 2 :(得分:0)
尝试为其添加默认日期
document.getElementById("creation-from-date").value = setDefautValue();
function setDefautValue() {
var date = new Date(); // today
date.setUTCHours(0, 0, 0, 0); //set default time 00:00 AM
const dStr = date.toISOString()
// remove seconds and milliseconds
return dStr.substring(0, dStr.indexOf(':', dStr.indexOf(':')+1))
}