最近在开发一店铺后台库存管理系统时遇到输入时间,开始是input type=text,但使用人员屡次搞不清楚格式出错,于是设置控件.
实际工作很简单,浏览器都支持input时间控件,添加控件设置默认时间即可
1.仅日期
<input type="date" name="time">
2.仅时间
<input type="time" name="time">
3.日期与时间
<input type="datetime-local" name="time">
JQuery方法
const dtime = $('input[name="time"]')
if (dtime.length === 1) {
const nowdate = new Date(),year = nowdate.getFullYear(),
month = nowdate.getMonth() + 1,
day = nowdate.getDate();
dtime.val(year+'-'+(month<10?'0'+month:month)+'-'+(day<10?'0'+day:day))
}
js方法
const dtime = document.getElementsByName("time")
if (dtime.length === 1) {
const nowdate = new Date(),year = nowdate.getFullYear(),
month = nowdate.getMonth() + 1,
day = nowdate.getDate();
dtime.value=year+'-'+(month<10?'0'+month:month)+'-'+(day<10?'0'+day:day);
}
默认的格式是:2023-08-24T22:56,在使用时将T替换即可
本文只涉及了最基本方法,控件样式不好看,但项目要求不高完成功能即可.
要求高的可以使用第三方的时间控件,很漂亮.
当然也可以自己开发设计样式
最终还是按需选择设计.