前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >JavaScript实现input框获取系统默认年月日时分秒

JavaScript实现input框获取系统默认年月日时分秒

作者头像
王小婷
发布于 2025-05-18 08:26:41
发布于 2025-05-18 08:26:41
9100
代码可运行
举报
文章被收录于专栏:编程微刊编程微刊
运行总次数:0
代码可运行

这是对旧的已上线项目的维护之中优化的一个部分,要求是在input框里面默认当前系统的时间。实现如下图所示的效果。

5640239-51d842f7fb96b33b.png
5640239-51d842f7fb96b33b.png

我这里用的是一款日历插件:jedate-开始使用一款好用的时间插件: https://cloud.tencent.com/developer/article/1140229,在实际运用之中,需要在input里面默认年月日,或者默认时分秒。

方法:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
   //时间选择
        var mydateInput = document.getElementById("startTime");
        var date = new Date();
        var dateString = date.getFullYear() + "/" + (date.getMonth() + 1) + "/" + date.getDate() + "  " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
        mydateInput.value = dateString;

html

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="jedate/jedate.js"></script>
    </head>

    <body>
        <input type="text" class="form-control input-medium" placeholder="开始时间" name="" id="startTime" />
        <input type="text" class="form-control input-medium" placeholder="结束时间" name="" id="endTime" />

    </body>
    <script type="text/javascript">
        jeDate({
            dateCell: "#startTime",
            //format: "YYYY-MM-DD ", //控制是否显示小时
            format: "YYYY-MM-DD hh:mm:ss", //控制是否显示小时
            isTime: true
        })

        jeDate({
            dateCell: "#endTime",
            //format: "YYYY-MM-DD ", //控制是否显示小时
            format: "YYYY-MM-DD hh:mm:ss", //控制是否显示小时
            isTime: true
        })

        //时间选择
        var mydateInput = document.getElementById("startTime");
        var date = new Date();
        var dateString = date.getFullYear() + "/" + (date.getMonth() + 1) + "/" + date.getDate() + "  " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
        mydateInput.value = dateString;

        var mydateInputs = document.getElementById("endTime");
        var dates = new Date();
        var dateStrings = dates.getFullYear() + "/" + (dates.getMonth() + 1) + "/" + dates.getDate() + "  " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
        mydateInputs.value = dateStrings;
    </script>

</html>

原文作者:祈澈姑娘 技术博客:https://www.jianshu.com/u/05f416aefbe1 90后前端妹子,爱编程,爱运营,文艺与代码齐飞,魅力与智慧共存的程序媛一枚。 坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,对于博客上面有不会的问题

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2025-05-16,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验