在 Kendo Datepicker 中使日期不可选择或不可点击

Question

有没有办法在 Kendo Datepicker 中使数组中的天数不可选择？

在模板中，我将它们设为不可见，但我希望它们可见且不可选择。

剃须刀：

<div>
@(Html.Kendo().DatePicker()
      .Name("datepicker")
      .Value(DateTime.Today)
      .MonthTemplate("# if ($.inArray(+data.date, birthdays) != -1) { #" +
                         "<div style=\"display:none;\">#= data.value #</div>" +
                     "# } else {#" +
                     "#= data.value #" +
                     "# } #")
)
</div>

脚本：

<script>
var today = new Date(),
    birthdays = [
        +new Date(today.getFullYear(), today.getMonth(), 11),
        +new Date(today.getFullYear(), today.getMonth() + 1, 6),
        +new Date(today.getFullYear(), today.getMonth() + 1, 27),
        +new Date(today.getFullYear(), today.getMonth() - 1, 3),
        +new Date(today.getFullYear(), today.getMonth() - 2, 22)
    ];
</script>

Answer 1

实际上我偶然发现了upon an answer，这让我走上了正确的道路，所以我会回答我自己的问题，以防有人遇到同样的问题。

已编辑：正如@CSharper 的 cmets 中所述，他在另一个线程中的回答非常相似。所以我也要去link to his answer。

我创建了一个样式类来使日期显示为禁用。

<style>
    .disabledDay {
        display: block;
        overflow: hidden;
        min-height: 22px;
        line-height: 22px;
        padding: 0 .45em 0 .1em;
        cursor: default;
        opacity: 0.5;
    }
</style>

我在选择器上注册了一个 onOpen 事件并在元素上添加了一个类

<div>
    @(Html.Kendo().DatePicker()
          .Name("datepicker")
          .Value(DateTime.Today)
          .Events(e => e.Open("onDateOpen"))
          .MonthTemplate("# if ($.inArray(+data.date, birthdays) != -1) { #" +
                     "<div class=\"disabledDay\">#= data.value #</div>" +
                 "# } else {#" +
                 "#= data.value #" +
                 "# } #")
    )
</div>

然后我创建了一个函数，通过 open-event 禁用链接本身

<script>
    var today = new Date(),
        birthdays = [
            +new Date(today.getFullYear(), today.getMonth(), 11),
            +new Date(today.getFullYear(), today.getMonth() + 1, 6),
            +new Date(today.getFullYear(), today.getMonth() + 1, 27),
            +new Date(today.getFullYear(), today.getMonth() - 1, 3),
            +new Date(today.getFullYear(), today.getMonth() - 2, 22)
        ];

    function onDateOpen(e) {
        //removing this class makes the day unselectable
        $(".disabledDay").parent().removeClass("k-link"); 
        //this removes the hyperlink styling
        $(".disabledDay").parent().removeAttr("href"); 
    };
</script>

瞧！ :)