0

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 <--- 最初の範囲の最後の 1 時間

18:00 <--- 2 番目の範囲の最初の 1 時間

19:00

...

22:00

どうすればいいのかわかりません。現時点では、必要な時間で配列を作成し、タイムピッカーに挿入しようとしていますが、それが可能かどうかはわかりません。より良い解決策がある場合は、お知らせください。

4

1 に答える 1

1

例の「#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();
于 2016-11-17T11:36:31.297 に答える