DateTimePicker 文档
安装
通过 CDN 引入：
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jquery-datetimepicker@2.5.20/build/jquery.datetimepicker.min.css">
<script src="https://cdn.jsdelivr.net/npm/jquery-datetimepicker@2.5.20/build/jquery.datetimepicker.full.min.js"></script>
通过 npm 安装：
npm install jquery-datetimepicker基本使用
最简单的初始化方式：
$('#datetimepicker').datetimepicker();
带配置的初始化：
$('#datetimepicker').datetimepicker({
format: 'Y-m-d H:i',
lang: 'zh',
step: 30
});
配置选项
| 选项 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| format | string | 'Y-m-d H:i' | 日期时间格式。Y:年, m:月, d:日, H:时(24), h:时(12), i:分, s:秒, a:am/pm |
| step | number | 60 | 时间选择的步进值（分钟） |
| lang | string | 'en' | 语言设置（支持 'en', 'zh', 'ja' 等） |
| timepicker | boolean | true | 是否显示时间选择器 |
| datepicker | boolean | true | 是否显示日期选择器 |
| weeks | boolean | false | 是否显示周数 |
| inline | boolean | false | 是否始终显示选择器 |
| minDate | date/string | false | 最小可选日期 |
| maxDate | date/string | false | 最大可选日期 |
| minTime | string | false | 最小可选时间（格式：'HH:mm'） |
| maxTime | string | false | 最大可选时间（格式：'HH:mm'） |
| defaultDate | date/string | null | 默认显示的日期 |
| defaultTime | string | null | 默认显示的时间 |
| value | string | '' | 初始值 |
| yearStart | number | 1950 | 年份选择的开始年 |
| yearEnd | number | 2050 | 年份选择的结束年 |
| todayButton | boolean | false | 是否显示"今天"按钮 |
| closeOnDateSelect | boolean | false | 选择日期后是否自动关闭 |
| validateOnBlur | boolean | true | 失去焦点时是否验证输入值 |
| scrollMonth | boolean | true | 是否允许月份滚动 |
| scrollTime | boolean | true | 是否允许时间滚动 |
| scrollInput | boolean | true | 是否允许输入框滚动 |
| mask | boolean/string | false | 输入掩码格式 |
方法
| 方法名 | 参数 | 描述 |
|---|---|---|
| show() | 无 | 显示日期时间选择器 |
| hide() | 无 | 隐藏日期时间选择器 |
| toggle() | 无 | 切换显示/隐藏状态 |
| getValue() | 无 | 获取当前选择的值 |
| setValue(value) | string | 设置日期时间值 |
| setOptions(options) | object | 设置选项 |
| setDate(date) | date/string | 设置日期部分 |
| setTime(time) | string | 设置时间部分 |
| getDate() | 无 | 获取日期对象 |
| destroy() | 无 | 销毁选择器实例 |
| reset() | 无 | 重置为初始状态 |
| validate() | 无 | 验证当前值 |
事件
| 事件名 | 参数 | 描述 |
|---|---|---|
| onShow | 无 | 选择器显示时触发 |
| onHide | 无 | 选择器隐藏时触发 |
| onChange | currentDateTime, $input | 值改变时触发 |
| onSelectDate | currentDateTime, $input | 选择日期时触发 |
| onSelectTime | currentDateTime, $input | 选择时间时触发 |
| onChangeMonth | month, year | 月份改变时触发 |
| onChangeYear | year | 年份改变时触发 |
| onChangeDateTime | currentDateTime | 日期时间改变时触发 |
| onGenerate | $picker | 选择器生成后触发 |
| beforeShow | 无 | 选择器显示前触发 |
| onClose | currentDateTime | 选择器关闭时触发 |
| onDestroy | 无 | 选择器销毁时触发 |