Указатель выбора времени Timepicker

Создайте указатель выбора времени Timepicker, который легко можно использовать, выбрав значение времени из предварительно заполненного раскрывающегося списка dropdown.

Применение

Чтобы применить указатель времени, добавьте атрибут data-uk-timepicker к элементу <input>. Timepicker автоматически отобразит на фокусе предварительно заполненный раскрывающийся список, по которому можно перемещаться, нажимая кнопку вверх или вниз на клавиатуре или же прокручивая мышью.

Важно! Для работы компонента «Timepicker» требуется компонент Autocomplete. Пожалуйста, убедитесь, что вы всегда используете их вместе.

Пример

Разметка

<form class="uk-form">
    <input type="text" data-uk-timepicker>
</form>

Формат времени

Чтобы отобразить время в виде 12-часового формата, установите параметр format и укажите ему 12h.

Пример

Разметка

<form class="uk-form">
    <input type="text" data-uk-timepicker="{format:'12h'}">
</form>

Параметры JavaScript

Это пример того, как установить параметры с помощью атрибута данных:

data-uk-timepicker="{format:'12h'}"
Опция Возможное значение По умолчанию Описание
format '24h' или '12h' '24h' Устанавливает предпочтительное обозначение времени
start Целое число от 0 до 24 0 Время начала
end Целое число от 0 до 24 24 Время окончания

Запуск элемента вручную

var timepicker = UIkit.timepicker(element, { /* options */ });