jquery-ui - jQuery 日期时间选择器 : disable time

Question

我正在使用 XDSoft jQuery datetimepicker 在我的应用程序中(Ruby on Rails 4(仅供引用，不使用 bootstrap datetimepicker))。

我想知道是否有办法在特定日期禁用/停用特定时间，例如仅禁用 12/17/2014 的 17:00？disabledDates: ['...']禁用特定日期。

我试过 disabledDateTimes和 disabledTimes但它们不起作用。
谢谢。

Answer 1

以下是如何使用您询问的 XDSoft DateTimePicker 完成此操作的一个示例。

我有一个 specificDates可用于添加要定位的日期的数组。

我也有一个 hoursToTakeAway多维数组对应于 specificDates您可以在其中指定要带走的小时数的数组。

HTML

<input class="eventStartDate newEventStart eventEditDate startTime eventEditMetaEntry" id="from_date" name="from_date" placeholder="Start date and time" readonly="readonly" type="text" />

Javascript

var specificDates = ['24/12/2014','17/12/2014'];

var hoursToTakeAway = [[14,15],[17]];

$('#from_date').datetimepicker({
    format:'d.m.Y H:i',
    timepicker: true,
    lang: 'en',
    onGenerate:function(ct,$i){
      var ind = specificDates.indexOf(ct.dateFormat('d/m/Y'));
      $('.xdsoft_time_variant .xdsoft_time').show();
      if(ind !== -1) {
          $('.xdsoft_time_variant .xdsoft_time').each(function(index){
              if(hoursToTakeAway[ind].indexOf(parseInt($(this).text())) !== -1)              {
                  $(this).hide();        
              }
          });
      }
    }
});

例子
Fiddle

基本上我正在利用 onGenerate在呈现每个日历之后发生的事件。然后我检查日期是否与指定的日期匹配，如果匹配，我们遍历所有时间元素并隐藏为特定日期指定的元素。

更新 Fiddle 实现禁用。

Fiddle 2