fastadmin页面日期时间组件的调用

最新推荐文章于 2025-06-17 10:34:32 发布

黎明科技

最新推荐文章于 2025-06-17 10:34:32 发布

阅读量5.8k

点赞数 8

CC 4.0 BY-SA版权

分类专栏： PHP 文章标签： php html html5 javascript jquery

本文链接：https://blog.youkuaiyun.com/chengxuyuan8/article/details/107258468

PHP 专栏收录该内容

5 篇文章

订阅专栏

本文详细介绍如何在HTML中配置日期时间选择插件，包括HTML结构设置与JS代码调用，确保日期时间选择器正常工作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

第一步 html

<div class="form-group col-lg-3">
     <div class="input-group form_datetime">
     <span class="input-group-addon">收集时间:</span>
     <input class="form-control datetimepicker" 
            data-date-format="YYYY-MM-DD" 
            type="text" 
            data-rule="required"  
            name="collecttime" 
            placeholder="请选择时间">
     </div>
</div>

如果以上步骤完成后试试如果可以调起来则完成，不可以的话在对应页面的js中添加如下js(直接复制粘贴)

/************************日期时间选择的插件**********************/
//绑定select元素事件
require(['bootstrap-datetimepicker'], function () {
    var options = {
        format: 'YYYY-MM-DD HH:mm:ss',
        icons: {
            time: 'fa fa-clock-o',
            date: 'fa fa-calendar',
            up: 'fa fa-chevron-up',
            down: 'fa fa-chevron-down',
            previous: 'fa fa-chevron-left',
            next: 'fa fa-chevron-right',
            today: 'fa fa-history',
            clear: 'fa fa-trash',
            close: 'fa fa-remove'
        },
        showTodayButton: true,
        showClose: true
    };
    $('.datetimepicker').parent().css('position', 'relative');
    $('.datetimepicker').datetimepicker(options);
});
/************************日期时间选择的插件END**********************/