Вы могли прочитать сообщение создателя jQuery John Resig об этом здесь: http://ejohn.org/blog/picking-time/ .
CSS Галерея имеет множество Средств выбора Времени. Взглянуть.
средство выбора времени Дизайна Perifer подобно для гугления одного
Извините, ребята .. может быть, немного поздно .. Я использовал NoGray .. это круто ..
NoGray - приятный глаз, но есть несколько соображений по удобству использования. Во-первых, аналоговые часы становятся все более непонятными, и молодым людям иногда трудно их читать. Во-вторых, перетаскивание мышью к определенному времени немного утомительно, как и средства выбора времени, использующие ползунок. В-третьих, взаимодействие с клавиатурой для этого средства выбора немного спорадическое.
Для более удобного выбора времени воспользуйтесь виджетом календаря AJAX Any + Time ™ Datepicker / Timepicker . Это, пожалуй, самый быстрый и простой в использовании инструмент выбора времени, потому что он использует простые кнопки для быстрого и легкого выбора определенного времени.
Интересный тест на удобство использования заключается в следующем: выберите нечетное время (скажем, 22:32), а затем посмотрите, сколько времени потребуется, чтобы точно выбрать это время, используя различные средства выбора времени. Вероятно, вы сможете сделать это быстрее с Any + Time ™, чем записать время вручную - просто попробуйте найти другой сборщик, о котором вы можете сказать это! Не говоря уже о том, что Any + Time ™ поддерживает бесчисленное множество форматов даты / времени, 12/24 часов, полную настройку CSS (или jQuery UI) и даже часовые пояса!
Мне не понравился ни один из предложенных средств выбора времени, поэтому я создал свой, вдохновленный Perifer's и спецификацией HTML5:
http://github.com/gregersrygg/jquery.timeInput
You можно использовать новые атрибуты html5 для ввода времени (шаг, мин., макс.) или использовать объект параметров:
<input type="time" name="myTime" class="time-mm-hh" min="9:00" max="18:00" step="1800" />
<input type="time" name="myTime2" class="time-mm-hh" />
<script type="text/javascript">
$("input[name='myTime']").timeInput(); // use default or html5 attributes
$("input[name='myTime2']").timeInput({min: "6:00", max: "15:00", step: 900}); // 15 min intervals from 6:00 am to 3:00 pm
</script>
Проверяет ввод следующим образом:
Спецификация HTML5 не допускает синтаксиса am / pm или локализованного времени, поэтому допускает только формат hh: mm. Секунды разрешены согласно спецификации, но я еще не реализовал это.
Это очень "альфа", поэтому могут быть некоторые ошибки. Не стесняйтесь присылать мне патчи / запросы на включение. Протестировано вручную в IE 6 и 8, FF, Chrome и Opera (последняя стабильная версия для Linux для последних).
Это лучшее, что я нашел на сегодняшний день http://trentrichardson.com/examples/timepicker/