Указатель выбора времени 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 */ });