【问题标题】:jQuery UI Datepicker - Disable specific daysjQuery UI Datepicker - 禁用特定日期
【发布时间】:2010-10-15 05:54:45
【问题描述】:

是否有任何(简单的)方法可以将 jQuery UI Datepicker 设置为不允许选择特定的预定日期?

我能够让this approach 工作,但是它会产生一个空错误,导致它无法在 IE 中显示。

'natDays[...].0' 为 null 或不是对象

提前致谢!

更新:如果我包含一些代码可能会有所帮助,对吧?无论如何,大部分内容都是直接取自上述线程:

natDays = [
        [7, 23], [7, 24], [8, 13], [8, 14], 
    ];

    function nationalDays(date) {
        for (i = 0; i < natDays.length; i++) {
            if (date.getMonth() == natDays[i][0] - 1
            && date.getDate() == natDays[i][1]) {
                return [false, natDays[i][2] + '_day'];
            }
        }
        return [true, ''];
    }

    function noWeekendsOrHolidays(date) {
        var noWeekend = $.datepicker.noWeekends(date);
        if (noWeekend[0]) {
            return nationalDays(date);
        } else {
            return noWeekend;
        }
    }


    $(function() { 
        $("#datepicker").datepicker({
            inline: true,
            minDate: new Date(2009, 6, 6), 
            maxDate: new Date(2009, 7, 14), 
            numberOfMonths: 2, 
            hideIfNoPrevNext: true,
            beforeShowDay: $.datepicker.noWeekends,
            altField: '#alternate',
        }); 
    });

再次感谢!

【问题讨论】:

  • 你能粘贴你的代码,说明你有什么会产生错误
  • 需要至少有问题的行的代码示例...

标签: jquery jquery-ui datepicker


【解决方案1】:

这是一种禁止选择特定日期的方法:

var unavailableDates = ["9-5-2011","14-5-2011","15-5-2011"];

function unavailable(date) {
  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
  if ($.inArray(dmy, unavailableDates) < 0) {
    return [true,"","Book Now"];
  } else {
    return [false,"","Booked Out"];
  }
}

$('#iDate').datepicker({ beforeShowDay: unavailable });

Source: jQuery - Datepicker - Disable Specific Dates

【讨论】:

    【解决方案2】:

    您是否尝试过在前面使用 'var' 关键字正确声明 natDays?

    另外 - 您的 natDays 定义末尾有一个额外的逗号。

    natDays[i][2] 不起作用,因为您的数组中只有 2 个项目 - 试试 ''

    此外,您需要正确设置 beforeShowDay 函数名称 - 看起来它甚至没有调用您的自定义函数

    【讨论】:

    • 嗯...刚试了一下。没有运气。这是 IE 返回的错误:'natDays[...].0' is null or not an object
    • 查看我最近的编辑...它没有正确定义(额外的逗号)
    • 好吧...我想我们正在取得进展!额外的逗号修复了 IE8 中的问题。你能告诉我你的第二条评论是什么意思吗? (我是JS新手……你能告诉我吗?)谢谢!
    【解决方案3】:

    您可以使用beforeShowDay 选项。我需要禁用该月 28 日之后的任何一天。这是我的代码。

    $('.datepicker').datepicker({
        dateFormat: "yy-mm-dd",
        beforeShowDay: function(date) {
            var day = date.getDate();
            if (day > 28) {
                return [false];
            } else {
                return [true];
            }
        }
    });
    

    这里有更多关于它的信息:http://api.jqueryui.com/datepicker/#option-beforeShowDay

    传入 beforeShowDay 回调的日期变量是一个 JavaScript 日期对象,因此可以使用各种库对其进行格式化,可以使用 date.getTime() 检索时间戳等。

    【讨论】:

    • @WHK 对不起,我不明白你的问题。
    【解决方案4】:
    beforeShowDay: $.datepicker.noWeekends,
    

    将会

    beforeShowDay: noWeekendsOrHolidays,
    

    【讨论】:

      【解决方案5】:

      IE 的问题很可能在以下行:

      altField: '#alternate',
      }); 
      

      尝试删除逗号符号,它应该可以工作。

      【讨论】:

        【解决方案6】:
         var unavailableDates = ["19-8-2014","14-9-2014"];
        
         function unavailable(date) {
            dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" +date.getFullYear();
            if ($.inArray(dmy, unavailableDates) < 0) {
             return [true,"","Book Now"];
            } else {
          return [false,"","Booked Out"];
          }
         }
        
         $('#iDate').datepicker({ beforeShowDay: unavailable });
        

        现场演示:http://jsfiddle.net/vfod0krm/

        【讨论】:

        • 请注意,对于已使用 minDate/maxDate 选项禁用的日期,这将显示“立即预订”作为工具提示
        猜你喜欢
        • 2012-04-02
        • 2017-07-31
        • 1970-01-01
        • 2020-12-25
        • 1970-01-01
        • 1970-01-01
        • 2015-07-31
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多