Bootstrap的datetimepicker插件用法总结（基于迅睿CMS）

迅睿CMS框架目前只要使用的是Bootstrap，在网站制作和功能二次开发过程中，经常需要用到datetimepicker时间控件，本文总结归纳了datetimepicker使用中的常见用法和参数设置。芝麻通后续将逐步更新迅睿CMS常用的基础设置。

    <div class="input-group date field_date_inputtime"><input id="dr_inputtime" name="data[inputtime]" type="text"
            style="width:100%;" value="{$t.endtime}" class="form-control "><span class="input-group-btn">
            <button class="btn default date-set" type="button">
                <i class="fa fa-calendar"></i>
            </button>
        </span></div>
    <script>
        $(function () {
            $(".field_date_inputtime").datetimepicker({
                isRTL: false,
                format: "yyyy-mm-dd",
                showMeridian: false,
                autoclose: true,
                minView: 2,
                pickerPosition: "bottom-left",
                todayBtn: "linked",
                todayHighlight: true,
                keyboardNavigation: true,
                weekStart: 1,
                daysOfWeekDisabled: [0, 6],
                startView: 2,
                startDate: new Date()
            });
        });
    </script>

1.1 format — 格式

String类型

1.2 weekStart — 一周从哪一天开始

Integer类型

默认值:0(周日)

0(周日)到6(周六)

1.3 startDate — 开始时间

Date类型

默认值:开始时间

这之前的时间不能选择

1.4 endDate— 结束时间

Date类型

默认值:结束时间

这之后的时间不能选择

1.5 daysOfWeekDisabled — 一周的周几不能选

String, Array类型

写法：'0,6'或者[0,6](周六、周日不能选择)

1.6 autoclose — 选完时间后是否自动关闭

Boolean类型

默认值:false

当选择一个日期之后是否立即关闭此日期时间选择器。

1.7 startView — 选完时间首先显示的视图

Number, String类型

默认值:2, ‘month’

点击选择器打开后首先显示的视图级别。

1.8 minView — 最终精确时间

Number, String类型

默认值:0, ‘hour’

日期时间选择器所能够提供的精确的时间选择视图。

1.9 maxView — 最高能展示的时间

Number, String类型

默认值:4, ‘decade’

日期时间选择器最高能展示的选择范围视图。

用法同上。

1.10 todayBtn — 当天日期按钮

Boolean, “linked”类型

默认值:false’

如果此值为true 或 “linked”,则在日期时间选择器组件的底部显示一个 “Today” 按钮用以选择当前日期。如果是true的话,”Today” 按钮仅仅将视图转到当天的日期,如果是”linked”,当天日期将会被选中。

1.11 todayHighlight — 当天日期高亮

Boolean类型

默认值:false

如果为true, 高亮当前日期。

不再举例。

1.12 keyboardNavigation — 方向键改变日期

Boolean类型

默认值:false

是否允许通过方向键改变日期。

1.13 language — 语言

String类型

默认值:’en’

中文:’zh-CN’

1.14 forceParse — 强制解析

Boolean类型

默认值:true

就是你输入的可能不正规,但是它会强制尽量解析成你规定的格式（format）

1.15 minuteStep — 步进值

Number类型

默认值:5

此数值被当做步进值用于构建小时视图。就是最小的视图是每5分钟可选一次。是以分钟为单位的。

1.16 pickerPosition — 选择框位置

String类型

默认值:’bottom-right’

还支持 : ‘bottom-left’,’top-right’,’top-left’

1.17 showMeridian — 是否显示上下午

Boolean类型

默认值:false

在日期和小时选择界面,出现上下午的选项

1.18 initialDate — 初始化日期时间

Date or String类型

默认值:new Date()

在打开时默认选当时的时间,显示在View中。

本文属原创，转载请注明原文：http://www.zhimatong.com/jiaocheng/862.html

为保证教程的实用性及扩大知识面覆盖，如果您有相似问题而未解决，可联系在线客服免费技术支持。