首页 jQuery js jQuery给input添加日期时间控件与默认时间

js jQuery给input添加日期时间控件与默认时间

最近在开发一店铺后台库存管理系统时遇到输入时间,开始是input type=text,但使用人员屡次搞不清楚格式出错,于是设置控件.

实际工作很简单,浏览器都支持input时间控件,添加控件设置默认时间即可

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);
}

后端获取String类型的日期时间格式

默认的格式是:2023-08-24T22:56,在使用时将T替换即可

关于其他

本文只涉及了最基本方法,控件样式不好看,但项目要求不高完成功能即可.

要求高的可以使用第三方的时间控件,很漂亮.

当然也可以自己开发设计样式

最终还是按需选择设计.

关注本站微信公众号