什么是一个好的Javascript时间select器?

什么是一个很好的时间select器的jQuery或独立的JS? 我想像谷歌在日历中使用的东西,它有15分钟的时间间隔下拉的通用时间,或者让你手动input一段时间,并validation它。

一些资源:

  • TimeDatePicker (jQuery插件)
  • jQuery.timepickr
  • jQuery.ptTimeSelect
  • 时间select器
  • 花式时间select器
  • NoGray时间select器

这是我find的最好的datehttp://trentrichardson.com/examples/timepicker/

这里是一个与Twitter Bootstrap的作品。

http://jdewit.github.com/bootstrap-timepicker/

我对任何build议的时间select器都不满意,所以我从Perifer's和HTML5规范中创build了自己的灵感:

http://github.com/gregersrygg/jquery.timeInput

您可以使用新的html5属性进行时间input(step,min,max),也可以使用选项对象:

<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> 

像这样validationinput:

  • 插入“:”如果丢失
  • 无效的时间? 用空白replace
  • 按步骤不是有效的时间? 向上/向下舍入到最接近的步骤

HTML5规范不允许am / pm或本地时间语法,所以它只允许格式hh:mm。 根据规格允许秒,但我还没有实施。

这是非常“阿尔法”,所以可能有一些错误。 随时给我发补丁/拉请求。 已经在IE 6和8,FF,Chrome和Opera(在后者的Linux上最新稳定)手动testing过。

你可以在这里阅读jQuery创build者John Resig的post: http : //ejohn.org/blog/picking-time/ 。

我一直在使用ClockPick 。

CSS图库有各种各样的时间select器。 看一看。

Perifer Design的时间select器与谷歌类似

如果有人对另一个JavaScript TimPicker感兴趣,我开发并维护了一个可以完成这个工作的jQuery插件。 它的工作方式就像EZ Time JS(虽然我直到5分钟前才知道它:D),使用户几乎可以以任何他们感觉舒服的方式input时间,并将input转换为通用格式。

签出jQuery的TimePicker选项页面 ,看看它的行动。

对不起家伙..也许有点晚了..我一直在使用NoGray ..这很酷..

我一直在使用jquery ui timepicker

NoGray是很好的眼睛糖果,但有几个可用性的考虑。 首先,模拟时钟变得越来越模糊,年轻人有时读起来很困难。 其次,用鼠标拖动到特定的时间有点繁琐,就像使用滑块的时间select器一样。 第三,这个select器的键盘互动有点零星。

对于更多可用的时间select器,请查看Any + Time™Datepicker / Timepicker AJAX Calendar Widget 。 这也许是最快最容易使用的时间select器,因为它使用简单的button来select具体的时间,速度和方便。

一个有趣的可用性testing是这样的:select一个奇怪的时间(比如10:32 pm),然后用多个时间select器精确地select这个时间需要多长时间。 你可以使用Any + Time™来更快地完成任务,而不是用手写出时间 – 只要find另一个你可以这么说的select器! 更何况,Any + Time™支持无数种date/时间格式,12/24小时制,完整的CSS(或jQuery UI)定制,甚至时区!