2

我有一个允许预订和选择日期的日历,但我需要禁用特定的工作日、特定月份,在某些情况下是第三个星期五或第二个星期二。所以我有这个函数和变量。但现在我意识到日历总是从实际月份开始。

在实际月份被禁用的情况下,日历从它开始。在这种特殊情况下,实际月份是八月,但在日历顶部,选择月份(下拉)选项显示下一个可用月份的名称(因为我添加了一个代码以使其从落下。

请看一下这个小提琴:http: //jsfiddle.net/amatoro/yFtLP/10/

它显示 8 月的日历(从 1 日星期四开始,到 31 日星期六结束),但在顶部显示为“sep” - 9 月。

我需要它从下一个可用的月历开始。在这种情况下,九月。但我不能用“defaultDate:(从 9 月开始的函数)”使它成为静态的。随着日期和月份的变化,所以如果我们在 12 月,那么如果从 9 月开始,日历就会出错(我知道要澄清这一点真的很愚蠢,但以防万一)。

jQuery("#datepicker").datepicker({
    showOn: "button",
    dateFormat : 'yy/mm/dd',
    buttonText: "Select",
    beforeShowDay: disableSpecificWeekDaysandMonths,
    changeMonth: true,
    changeYear: true,
    minDate: 0,
    stepMonths: 0,
    maxDate: '2y'
}).focus(function() {
    $(".ui-datepicker-prev, .ui-datepicker-next").remove();
    $.each(
        monthsToDisable,
        function( intIndex, objValue ){     
            $(".ui-datepicker-month > option[value='" + objValue + "']").remove();
        }
     );
});

var daysToDisable = [0, 1, 2, 3, 4, 6]; 
var monthsToDisable = [4,5,6,7]; 
var specificDaysToDisable = [5]; 
var weektoEnable = [3];

function disableSpecificWeekDaysandMonths(date) {

    var day = date.getDay();
    if ($.inArray(day, daysToDisable) != -1) {
        return [false];
    }

    var month = date.getMonth();
    if ($.inArray(month, monthsToDisable) != -1) {
        return [false];
    }

    var date2 = date.getDate();
    if ($.inArray(day, specificDaysToEnable) != -1 && date.getWeekOfMonth()!= weektoEnable) {
        return [false];
    }
    return [true]
}

Date.prototype.getWeekOfMonth = function(exact) {
    var month = this.getMonth()
        , year = this.getFullYear()
        , firstWeekday = new Date(year, month, 1).getDay()
        , lastDateOfMonth = new Date(year, month + 1, 0).getDate()
        , offsetDate = this.getDate() + firstWeekday - 1
        , index = 1 // start index at 0 or 1, your choice
        , weeksInMonth = index + Math.ceil((lastDateOfMonth + firstWeekday - 7) / 7)
        , week = index + Math.floor(offsetDate / 7)
    ;
    if (exact || week < 2 + index) return week;
    return week === weeksInMonth ? index + (weeksInMonth -1 ) : week;
};

我会继续尝试一些选项,但有时我会创建很长的代码,而不是简单直接的代码,因为我缺乏知识。

提前致谢!

4

1 回答 1

0

我找到了一种方法,但仍然有一些小事情要处理。这里基本上准备好了,但我仍然需要找到一种方法来使 defaultAvailableDate 函数中的“9(下一个可用月份)”是动态的而不是静态的。我的意思是,创建一个函数来补充 defaultAvailableDate 以使其计算下一个可用月份。也许有人可以帮助指导我:

小提琴:http: //jsfiddle.net/amatoro/9tSJh/6/

下面的代码按预期工作,但由于“下个月”是静态的,我将无法在所有行程中使用它:

 Date.prototype.getWeekOfMonth = function(exact) {
     var month = this.getMonth()
         , year = this.getFullYear()
         , firstWeekday = new Date(year, month, 1).getDay()
         , lastDateOfMonth = new Date(year, month + 1, 0).getDate()
         , offsetDate = this.getDate() + firstWeekday - 1
         , index = 1 // start index at 0 or 1, your choice
         , weeksInMonth = index + Math.ceil((lastDateOfMonth + firstWeekday - 7) / 7)
         , week = index + Math.floor(offsetDate / 7)
     ;
     if (exact || week < 2 + index) return week;
     return week === weeksInMonth ? index + (weeksInMonth -1 ) : week;
 };

 jQuery("#datepicker").datepicker({
     showOn: "button",
     dateFormat : 'yy/mm/dd',
     buttonText: "Select",
     beforeShowDay: disableSpecificWeekDaysandMonths,
     changeMonth: true,
     changeYear: true,
     minDate: 0,
     stepMonths: 0,
     maxDate: '2y',
     defaultDate: defaultAvailableDate(),
 }).focus(function() {
     $(".ui-datepicker-prev, .ui-datepicker-next").remove();
     $.each(
         monthsToDisable,
         function( intIndex, objValue ){     
             $(".ui-datepicker-month > option[value='" + objValue + "']").remove();
         }
      );
 });

 var daysToDisable = [0, 1, 2, 3, 4, 6]; 
 var monthsToDisable = [5,6,7,8]; 
 var specificDaysToEnable = [5]; 
 var weektoEnable = [3];


 function defaultAvailableDate( ) { 
     var d = new Date();
     var n = d.getMonth(); 
     var monthsToDisable = [5,6,7,8]; 

     if( $.inArray(n, monthsToDisable) != -1){

       var offset = (n < 9) ? 0 : null;
       var availableMonth = 9 + offset - n;
       return '+' + availableMonth+ 'm';   

     } else {
          return '';   
     }

 }

 function disableSpecificWeekDaysandMonths(date) {

     var day = date.getDay();
     if ($.inArray(day, daysToDisable) != -1) {
         return [false];
     }

     var month = date.getMonth();
     if ($.inArray(month, monthsToDisable) != -1) {
         return [false];
     }

     var date2 = date.getDate();
     var inArray = $.inArray(day, specificDaysToEnable);
     if (inArray != -1 && date.getWeekOfMonth()!= weektoEnable) {
         return [false];
     }
     return [true]
 }

谢谢!

于 2013-09-03T18:25:52.563 回答