公司项目用的是JeePlus，在使用datetimepicker的时候发现它有些配置和bootstrap和JQuery UI的参数不一样，找了半天，只能看一下vendor.js的源码。
K.fn.datetimepicker.defaults = {
timeZone: "Etc/UTC", // 时区
format: !1, // 日期格式
dayViewHeaderFormat: "MMMM YYYY", // 头部时间显示
extraFormats: !1, // 其他日期格式
stepping: 1, // 步进器 例：stepping: 10，10:00:00 => 10:10:00
minDate: !1, // 开始时间 不允许设置minDate以前的时间，注意：该方法会重写defaultDate和useCurrent
maxDate: !1, // 最大时间 不允许设置maxDate以后的时间，注意：该方法会重写defaultDate和useCurrent
useCurrent: !0, // 点击弹出选择器后，文本框是否获取并显示当前时间
collapse: !0, // 年月日和小时时间界面是否合在一起显示
locale: Z.locale(), // 本地化
defaultDate: !1, // 默认时间
disabledDates: !1, // 不可选时间 array
enabledDates: !1, // 可选时间 array
icons: { // 图标更改 引号里是样式名
time: "glyphicon glyphicon-time",
date: "glyphicon glyphicon-calendar",
up: "glyphicon glyphicon-chevron-up",
down: "glyphicon glyphicon-chevron-down",
previous: "glyphicon glyphicon-chevron-left",
next: "glyphicon glyphicon-chevron-right",
today: "glyphicon glyphicon-screenshot",
clear: "glyphicon glyphicon-trash",
close: "glyphicon glyphicon-remove"
},
tooltips: { // 鼠标悬停在控件上，弹出提示文字
today: "Go to today",
clear: "Clear selection",
close: "Close the picker",
selectMonth: "Select Month",
prevMonth: "Previous Month",
nextMonth: "Next Month",
selectYear: "Select Year",
prevYear: "Previous Year",
nextYear: "Next Year",
selectDecade: "Select Decade",
prevDecade: "Previous Decade",
nextDecade: "Next Decade",
prevCentury: "Previous Century",
nextCentury: "Next Century",
pickHour: "Pick Hour",
incrementHour: "Increment Hour",
decrementHour: "Decrement Hour",
pickMinute: "Pick Minute",
incrementMinute: "Increment Minute",
decrementMinute: "Decrement Minute",
pickSecond: "Pick Second",
incrementSecond: "Increment Second",
decrementSecond: "Decrement Second",
togglePeriod: "Toggle Period",
selectTime: "Select Time"
},
useStrict: !1, // 严格模式
sideBySide: !1, // 将时间选择移动到右边，与日期选择并排
daysOfWeekDisabled: !1, // 一周内禁止选择时间 0为周日，1-6为周一-周六 例：[0, 6] 禁用周六日
calendarWeeks: !1, // 是否显示当前周是今年的第几周
viewMode: "days", // 在初次打开日期选择器时的显示模式 'decades','years','months','days'
toolbarPlacement: "default", // 工具按钮显示位置 'default', 'top', 'bottom'，‘default'和‘bottom'是一样的
showTodayButton: !1, // 是否显示返回今天的按钮
showClear: !1, // 显示“清除按钮”
showClose: !1, // 显示“关闭按钮”
widgetPositioning: { // 指定日期选择器弹出的方向，默认在垂直方向和水平方向都采用自适应
horizontal: "auto",
vertical: "auto"
},
widgetParent: null,
ignoreReadonly: !1,
keepOpen: !1,
focusOnShow: !0, // 点击打开日期选择器后，自动focus文本框
inline: !1, // 不使用文本框的日期选择器
keepInvalid: !1, // 是否允许文本框键入的日期格式无效，不允许时文本框会自动修改成正确的格式
datepickerInput: ".datepickerinput",
keyBinds: {
up: function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") ? this.date(t.clone().subtract(7, "d")) : this.date(t.clone().add(this.stepping(), "m"))
}
},
down: function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") ? this.date(t.clone().add(7, "d")) : this.date(t.clone().subtract(this.stepping(), "m"))
} else this.show()
},
"control up": function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") ? this.date(t.clone().subtract(1, "y")) : this.date(t.clone().add(1, "h"))
}
},
"control down": function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") ? this.date(t.clone().add(1, "y")) : this.date(t.clone().subtract(1, "h"))
}
},
left: function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") && this.date(t.clone().subtract(1, "d"))
}
},
right: function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") && this.date(t.clone().add(1, "d"))
}
},
pageUp: function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") && this.date(t.clone().subtract(1, "M"))
}
},
pageDown: function(e) {
if (e) {
var t = this.date() || this.getMoment();
e.find(".datepicker").is(":visible") && this.date(t.clone().add(1, "M"))
}
},
enter: function() {
this.hide()
},
escape: function() {
this.hide()
},
"control space": function(e) {
e.find(".timepicker").is(":visible") && e.find('.btn[data-action="togglePeriod"]').click()
},
t: function() {
this.date(this.getMoment())
},
delete: function() {
this.clear()
}
},
debug: !1,
allowInputToggle: !1,
disabledTimeIntervals: !1,
disabledHours: !1,
enabledHours: !1,
viewDate: !1
}
此版本中，datetimepicker的事件仅有dp.change、dp.update、dp.hide、dp.show。
例：
// 时间选择器
$('#timePicker').datetimepicker({
inline : true, // 一直显示
format: 'Y-M-D',
showTodayButton: true, // 显示当前日期按钮
focusOnShow: true,
}).on('dp.update', function(ev){ // 日期更新事件
setDateSign(setDataList);
}).on('dp.change', function(ev){ // 日期改变事件
setDateSign(setDataList);
});
在时间选择器上打点方法
let setDataList = [
{ time: "2019-05-02", full: false }, // full 为标志是否满足某一条件
{ time: "2019-06-03", full: true },
{ time: "2019-06-02", full: false },
{ time: "2019-06-10", full: true },
];
/**
* 设置标识
* @param 需要标记的日期
*/
function setDateSign (setDataList) {
var _this = this;
var dates = $(".datepicker-days thead .picker-switch").html();
// 获取年
var year = dates.slice(-4);
// 获取月份
var months = dates.substr(0, dates.length-6);
var month;
switch (months){
case "一":
month = 1;
break;
case "二":
month = 2;
break;
case "三":
month = 3;
break;
case "四":
month = 4;
break;
case "五":
month = 5;
break;
case "六":
month = 6;
break;
case "七":
month = 7;
break;
case "八":
month = 8;
break;
case "九":
month = 9;
break;
case "十":
month = 10;
break;
case "十一":
month = 11;
break;
case "十二":
month = 12;
break;
}
$(".datepicker-days tbody td").each(function(){
// 如果是下一个月
if( $(this).hasClass("new") ){
var nowMonth = month + 1;
var day = $(this).html();
if(day < 10){
day = '0' + day;
}
if(nowMonth < 10){
nowMonth = '0' + nowMonth;
}
} else if( $(this).hasClass("old") ){ // 如果是上一个月
var nowMonth = month - 1;
var day = $(this).html();
if (day < 10){
day = '0' + day;
}
if (nowMonth < 10){
nowMonth = '0' + nowMonth;
}
} else { // 当月
var day=$(this).html();
var nowMonth = month;
if (day < 10){
day = '0' + day;
}
if(nowMonth < 10){
nowMonth = '0' + month;
}
}
var date = year + '-' + nowMonth + '-' + day;
for (var i = 0 ; i < setDataList.length; i++){
if (setDataList[i].time === date){
$(this).addClass('sign'); // 添加标识
if (setDataList[i].full) {
$(this).addClass('full'); // 添加额外标识
}
}
}
});
}
其它可参考：
bootstrap3日期选择器(datepicker)属性
Bootstrap 3 Datepicker v4 Docs