JQuery-щ-timepicker - пользовательский выпадающий 2 другой диапазон времени (утром и днем)

Question

я должен настроить JQuery-UI-timepicker от https://github.com/jonthornton/jquery-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 < --- последний час первого диапазона

18 : 00 < --- первый час второго диапазона

19:00

...

22:00

Я понятия не имею, как это сделать. На данный момент я пытаюсь создать массив с необходимыми часами и ввести в timepicker, но я не знаю, возможно ли это. Если есть лучшее решение, дайте мне знать.

Answer 1

Вы можете использовать '#disableTimeRangesExample' из examples, чтобы отключить определенные времена.

$('#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();