【发布时间】:2014-12-30 05:22:52
【问题描述】:
如何在初始化时禁用PickMeUp 中的日期数组?
我有一个日期数组。我想要做的是禁用这些日期,因此用户无法选择它们。
【问题讨论】:
标签: jquery date jquery-plugins datepicker calendar
如何在初始化时禁用PickMeUp 中的日期数组?
我有一个日期数组。我想要做的是禁用这些日期,因此用户无法选择它们。
【问题讨论】:
标签: jquery date jquery-plugins datepicker calendar
我参加(安静的)派对有点晚了,但这是解决方案。
您需要做的是将日期加载到数组中。然后,您可以使用PickMeUp 的object render event 检查此数组,并根据数组中的日期检查每个日期。如果任何日期重合,您只需返回对象disabled: true,用户将无法选择日期。
此外,我还返回类 disabled 以改进禁用日期的 CSS 颜色。这是因为PickMeUp 禁用日期的默认配色方案是黑色;这让他们很难看到。
下面的 Javascript/jQuery 实现了你想要的:
// Creating some 'sample' dates
var datesArray = [];
var d = new Date();
for (i = 2; i < 7; i++) {
var tempDay = new Date(); tempDay.setHours(0,0,0,0);
tempDay.setDate(d.getDate()+i);
datesArray.push(tempDay.getTime());
}
$(function () {
$('.multiple').pickmeup({
flat: true,
mode: 'multiple',
// Before rendering each date, deselect dates if in the array
render: function(date) {
if ($.inArray(date.getTime(), datesArray) > -1){
return {
disabled : true,
class_name : 'disabled'
}
}
}
});
});
// Little hack to deselect current day: PickMeUp forces you to have a default date :(
$('.pmu-today').click();
使用以下 CSS:
.disabled {
color: #5C5C8A !important;
background: #000033;
}
【讨论】:
pickmeup('.clndr', {
flat : true,
mode : 'range',
calendars : 1,
format: 'Y-m-d',
separator: ',',
min : new Date(),
select_month :false,
select_year : false,
render: function(date) {
//удаляем отсюда--
if ((today.getMonth() + 1) < 10) { monday_mec = '0' + (today.getMonth() + 1); }
var date1 = today.getUTCFullYear() + '-' + monday_mec + '-' + (today.getDate() + 3) + 'T21:00:00.000Z';
var date2 = today.getUTCFullYear() + '-' + monday_mec + '-' + (today.getDate() + 4) + 'T21:00:00.000Z';
//--до сюда
//вместо date1 и date2 ставим свои даты в формате 2017-09-30T21:00:00.000Z
var disabled_days = [new Date(date1), new Date(date2)];
for(i = 0; i < disabled_days.length; i++)
if (date.toString() == disabled_days[i].toString()) {
return {
disabled : true,
class_name : 'disabled_dates'
}
}
}
}).clear();
【讨论】: