我们使用Bootstrap创建了一个自定义日期框组件。但是,当我们选择日期时,我们无法关闭日历日期选择器,然后选择不关闭的日历。
此处有人告诉我如何解决此问题。实际上我们在JS中没有很好的指挥。
这是bootstrap-datetimepicker.js。
初始化代码:
init = function() {
var icon = false, i, dDate;
picker.options = $.extend({}, defaults, options);
if (!(picker.options.pickTime || picker.options.pickDate))
throw new Error('Must choose at least one picker');
picker.id = dpgId++;
moment.lang(picker.options.language);
picker.date = moment();
picker.element = $(element);
picker.unset = false;
picker.isInput = picker.element.is('input');
picker.component = false;
if (picker.element.hasClass('input-group'))
picker.component = picker.element.find('.input-group-addon');
picker.format = picker.options.format;
if (!picker.format) {
if (picker.isInput)
picker.format = picker.element.data('format');
else
picker.format = picker.element.find('input').data('format');
if (!picker.format)
picker.format = (picker.options.pickDate ? 'L' : '');
picker.format += (picker.options.pickTime ? ' LT' : '');
}
if (picker.component)
icon = picker.component.find('span');
if (picker.options.pickTime) {
if (icon && icon.length) {
picker.timeIcon = icon.data('time-icon');
picker.upIcon = icon.data('up-icon');
picker.downIcon = icon.data('down-icon');
}
/* if (!picker.timeIcon)
picker.timeIcon = 'glyphicon glyphicon-time';*/
if (!picker.upIcon)
picker.upIcon = 'glyphicon glyphicon-chevron-up';
if (!picker.downIcon)
picker.downIcon = 'glyphicon glyphicon-chevron-down';
if (icon)
icon.addClass(picker.timeIcon);
}
if (picker.options.pickDate) {
if (icon && icon.length)
picker.dateIcon = icon.data('date-icon');
if (!picker.dateIcon)
picker.dateIcon = 'glyphicon glyphicon-calendar';
if (icon) {
icon.removeClass(picker.timeIcon);
icon.addClass(picker.dateIcon);
}
}
picker.widget = $(
getTemplate(picker.timeIcon, picker.upIcon,
picker.downIcon, picker.options.pickDate,
picker.options.pickTime, picker.options.collapse))
.appendTo('body');
picker.minViewMode = picker.options.minViewMode
|| picker.element.data('date-minviewmode') || 0;
if (typeof picker.minViewMode === 'string') {
switch (picker.minViewMode) {
case 'months':
picker.minViewMode = 1;
break;
case 'years':
picker.minViewMode = 2;
break;
default:
picker.minViewMode = 0;
break;
}
}
picker.viewMode = picker.options.viewMode
|| picker.element.data('date-viewmode') || 0;
if (typeof picker.viewMode === 'string') {
switch (picker.viewMode) {
case 'months':
picker.viewMode = 1;
break;
case 'years':
picker.viewMode = 2;
break;
default:
picker.viewMode = 0;
break;
}
}
for (i in picker.options.disabledDates) {
dDate = picker.options.disabledDates[i];
dDate = moment(dDate);
// if this is not a valid date then set it to the startdate -1
// day so it's disabled.
if (!dDate.isValid)
dDate = moment(startDate).subtract(1, "day").format("L");
picker.options.disabledDates[i] = dDate.format("L");
}
picker.startViewMode = picker.viewMode;
picker.setStartDate(picker.options.startDate
|| picker.element.data('date-startdate'));
picker.setEndDate(picker.options.endDate
|| picker.element.data('date-enddate'));
fillDow();
fillMonths();
fillHours();
fillMinutes();
update();
showMode();
attachDatePickerEvents();
if (picker.options.defaultDate !== "")
picker.setValue(picker.options.defaultDate);
}
答案 0 :(得分:1)
当您打开website和阅读时,它会清楚地说:
隐藏日期选择器。
.datepicker('hide')
屏幕截图,如果您错过了它:
我不明白你是如何错过它的,即使你没有JavaScript的命令。
如果这不是正确的问题,请创建一个代码段,然后演示问题,以便我们解决问题。