Gas*_*per 8 jquery jquery-ui date range jquery-ui-datepicker
我正在使用这个多日期选择器.是否可以使用日期范围模式,不选择周末?
我已经完成了multidatepicker周末被阻止,用户只能选择5天,但这不是我的目标.我想要这个功能:当用户点击特定日期时,范围内的五天将突出显示而没有周末日......
我的代码如下:
jQuery('#deliverydate').multiDatesPicker({
minDate:0,
beforeShowDay: noWeekendsOrHolidays,
mode: 'daysRangeWithoutWeekends',
autoselectRange: [0,5],
numberOfMonths: 2
});
Run Code Online (Sandbox Code Playgroud)
现在我非常接近我自己的解决方案:
我计算所有必须启用的日子和所有新的日子,如果周末有天数,则必须选择.
我在multidatepicker.js daysRangeWithoutWeekends中添加我的新方法,我计算所有新的和禁用的日期.然后我使用两个foreach循环,我禁用并启用新日期:
$.each(all_removed_dates, function(index, value) {
methods.removeDates.call(obj, value);
});
$.each(all_new_dates, function(index, value) {
methods.addDates.call(obj,value);
});
Run Code Online (Sandbox Code Playgroud)
value是Date对象.第一个foreach循环完美运行并删除所有突出显示的周末,但第二个循环不起作用.它返回错误:
Empty array of dates received.
Run Code Online (Sandbox Code Playgroud)
你知道为什么吗?
对于所有人,你不明白我的目标是什么:
如果我点击21.6.2012日期21.6.,22.6,25.6,26.6.,27.6,我必须在没有周末的情况下选择5天.必须被选中.
使用上面的代码我设法在周末删除突出显示的类但不知道为什么第二个循环(看我的代码上面)没有突出显示26.6.2012和27.6.2012.
首先,这不是通用解决方案。我没有时间寻求通用解决方案。我的解决方案是,如果您必须选择没有周末的 5 天。
在 jquery-ui.multidatepicker.js 的 onSelect 方法(cca.81 行)中添加:
if(this.multiDatesPicker.mode == 'daysRangeWithoutWeekends' && this.multiDatesPicker.dates.picked.length > 0){
var i = 0,
last
if(this.multiDatesPicker.dates.picked[0].getDay() == 2){ //thusday
i = 1
//remove sunday
all_removed_dates.push(this.multiDatesPicker.dates.picked[4])
}
if(this.multiDatesPicker.dates.picked[0].getDay() == 3){//wednesday
i = 2
//remove sunday and saturday
all_removed_dates.push(this.multiDatesPicker.dates.picked[3], this.multiDatesPicker.dates.picked[4])
}
if(this.multiDatesPicker.dates.picked[0].getDay() == 4){ //thursday
i=2
all_removed_dates.push(this.multiDatesPicker.dates.picked[2], this.multiDatesPicker.dates.picked[3])
}
if(this.multiDatesPicker.dates.picked[0].getDay() == 5){ //friday
i=2
all_removed_dates.push(this.multiDatesPicker.dates.picked[1], this.multiDatesPicker.dates.picked[2])
}
last = this.multiDatesPicker.dates.picked.pop()
this.multiDatesPicker.dates.picked.push(last)
if(this.multiDatesPicker.dates.picked[0].getDay() == 2){ //thusday
//if we have thusday we add 2 day after last day so last day in range was saturday and we add 2 day and we get date for monday
var new_date = new Date(last.getFullYear(), last.getMonth(), last.getDate() + 2)
all_new_dates.push(new_date)
}else{
//if there were sunday and saturday in range we add 2 days to last date in range
for(var j = 1; j <= i; j++){
var new_date = new Date(last.getFullYear(), last.getMonth(), last.getDate() + j)
all_new_dates.push(new_date)
}
}
var obj = this
//remove sunday and saturday
$.each(all_removed_dates, function(index, value) {
methods.removeDates.call(obj, value);
});
//add new days
$.each(all_new_dates, function(index, value) {
methods.add_new_date.call(obj,value);
});
}
Run Code Online (Sandbox Code Playgroud)
在 jquery-ui.multidatepicker.js 中的 ToogleDate 方法(cca.431 行)中,在 case 'daysRange' 之前添加:
case 'daysRangeWithoutWeekends':
Run Code Online (Sandbox Code Playgroud)
在 jquery-ui.multidatepicker.js 中的 setMode(cca.473row) 中,在 case 'daysRange' 之前添加:
case 'daysRangeWithoutWeekends':
Run Code Online (Sandbox Code Playgroud)
calander 初始化为:
jQuery('#deliverydate').multiDatesPicker({
minDate:0,
beforeShowDay: noWeekendsOrHolidays,
mode: 'daysRangeWithoutWeekends',
autoselectRange: [0,5],
numberOfMonths: 2
});
Run Code Online (Sandbox Code Playgroud)
如果有人制作通用算法请分享=)