jQuery 日期选择器排除日期

Question

我想要从 jQuery datepicker ui 中执行各种类型的排除日期。这些在下面。

• 单一日期：一个或多个特定日期。
• 循环日：这些日子应始终从日历中禁用，例如；星期日。
• 循环日期：应始终禁用特定日期。
• 期间：禁用两个日期范围之间的日期。
• 循环周期：禁用两个日期范围之间的循环日期。

我的 JSON 数据

{ “单身的”： [ “2012 年 2 月 4 日”， “2012 年 3 月 2 日” ], “循环日”：[ 0 ], “循环日期”：[ 28 ], “时期”： [ { “来自”：“2012年2月21日”， “至”：“2012 年 2 月 22 日” } ], “循环周期”：[ { “来自”：“2012年2月28日”， “至”：“2012 年 2 月 29 日”， “期间”：“每月” } ] }

我该怎么做，有人帮助我。

谢谢。

Answer 1

偷偷地使用 beforeShowDay 回调。抱歉耽搁了，我在 recurrent_period 中遇到了一个错误，花了我一段时间才发现。我在测试套件中添加了一个“年度”案例。如果我忽略了什么，请告诉我。有趣的问题！ jsFiddle

var invalid = { "single": [ "2/4/2012", "3/2/2012" ], "recurrent_day": [ 0 ], "recurrent_date": [ 28 ], "period": [ { "from": "2/21/2012", "to": "2/22/2012" } ], "recurrent_period": [ { "from": "2/28/2012", "to": "2/29/2012", "period": "monthly" },{ "from": "2/7/2012", "to": "2/9/2012", "period": "yearly" } ] };
function single(date){
    var USdate = (date.getMonth() + 1) + "/" + date.getDate() + "/" + date.getFullYear();
    return ($.inArray(USdate,invalid.single) > -1);
}
function recurrent_day(date){
    return ($.inArray(date.getDay(),invalid.recurrent_day) > -1);
}
function recurrent_date(date){
    return ($.inArray(date.getDate(),invalid.recurrent_date) > -1);
}
function period(date){
    var i, num, period, start, startArray, end, endArray;
    num = invalid.period.length;
    for(i=0;i<num;i++){
        period = invalid.period[i];
        startArray = period.from.split('/');
        start = new Date(startArray[2], (startArray[0] - 1), startArray[1]);
        endArray = period.to.split('/');
        end = new Date(endArray[2], (endArray[0] - 1), endArray[1]);        
        if(date>=start && date<=end){
            return true;
        }
    }
    return false;
}
function recurrent_period(date){
    var i, num, period, recurrence, startArray, endArray, startDay, endDay, start, end;
    num = invalid.recurrent_period.length;
    for(i=0;i<num;i++){
        period = invalid.recurrent_period[i];
        recurrence = period.period;
        startArray = period.from.split('/');
        endArray = period.to.split('/');

        if( recurrence === 'monthly' ){  
            startDay = parseInt( startArray[1], 10);
            endDay = parseInt( endArray[1], 10);
            if( date.getDate() >= startDay && date.getDate() <= endDay ){
                return true;             
            }               
        }else if( recurrence === 'yearly' ){
            start = new Date(date.getFullYear(), (startArray[0] - 1), startArray[1]);
            end = new Date(date.getFullYear(), (endArray[0] - 1), endArray[1]);  
            console.log({start:start.toDateString() ,end:end.toDateString(),day:date.toDateString()})   
            if(date>=start && date<=end){
                return true;
            }  
        }
    }
    return false;
}

$('input').datepicker({
    beforeShowDay: function(date){
        if(single(date)){
            return [false];
        }else if(recurrent_day(date)){
            return [false];
        }else if(recurrent_date(date)){
            return [false];
        }else if(period(date)){
            return [false];
        }else if(recurrent_period(date)){
            return [false];
        }
        return [true];
    }
});