Question

我必须从https://github.com/jonthornton/jquery-timepicker

自定义jquery-ui-timepicker

目标是在特定时间范围内引入休息时间：

我的初始代码

jQuery(".my_time_field").timepicker({
    "minTime": "10:00",
    "maxTime": "22:00",
    "disableTextInput": "true",
    "disableTouchKeyboard": "true",
    "scrollDefault": "now",
    "step": "60",
    "selectOnBlur": "true",
    "timeFormat": "H:i"
});

此代码生成如下的下拉列表：

10:00

11:00

...

21:00

22:00

但我必须显示例如。

10:00

11:00

12:00

13:00

14:00＆lt; ---第一个范围的最后一小时

18:00＆lt; ---第二个范围的第一个小时

19:00

...

22:00

我不知道该怎么做。目前我正在尝试创建一个具有所需时间的数组并注入时间戳，但我不知道这是否可能。如果有更好的解决方案，请告诉我。

Answer 1

您可以使用examples中的'#disableTimeRangesExample'来停用特定时间。

$('#disableTimeRangesExample').timepicker({
    'disableTimeRanges': [
        ['1am', '2am'],
        ['3am', '4:01am']
    ]
});

如果您不想显示已禁用的选项，可以使用jquery隐藏或删除它们。

这是禁用选项的标记

<li class="ui-timepicker-am ui-timepicker-disabled ui-timepicker-selected">1:00am</li>

你可以隐藏它

$('.ui-timepicker-disabled').css('display', 'none');

或将其删除

$('.ui-timepicker-disabled').remove();

jquery-ui-timepicker - 具有2个不同时间范围的自定义下拉列表（上午和下午）

1 个答案: