在Javascript/jQuery中哪里可以找到时间范围小部件？

Question

我在Javascript/CSS/jQuery中寻找某种TimeRange小部件。我不是在寻找一个时间/日期选择器，它是广泛可用的。

我需要它为一个网站，让企业选择他们的开放时间点击和悬停在他们的开放时间。

+-----------------------------+
| 0h 0h15m 0h30m    ... 23:45 |
+-----------------------------+

有人见过这么漂亮的、可定制的定时器选择器小部件吗？

干杯

Answer 1

我会找一个滑块小工具..然后将所需的时间设置为间隔。

jQuery UI有一个：jQuery UI Slider。

更新：基于下面的评论(单滑块与双滑块)...

1.)已经有一篇关于制作2 handled slider using the jQuery UI slider here的帖子了。

或者如果你有两个滑块...一个是开业时间，一个是关门时间...每个片段被分成15分钟的片段，但每个片段只有半天，这行得通吗？

例如(忽略ASCII图形的丑陋)

 Open Time (AM): 12   1    2    3    4    5    6    7    8 |  9    10   11   12
                                                           ^ 8:15am

Close Time (PM): 12   1    2    3    4    5    6  |  7    8    9    10   11   12
                                                  ^6:30pm

此外，如果这是“典型”业务...你可能会从11 5am <->凌晨5点开始从滑块上切掉。

或,

我不太喜欢脚本，但他们似乎有一个double slider

Answer 2

http://trentrichardson.com/examples/timepicker/

转到“只显示时间选择器而不显示日期选择器”，并检查这是否是您所需要的。

Answer 3

http://ghusse.github.io/jQRangeSlider/index.html

演示在这里jQRangeSlider和这里Technical demo

jQRangeSlider是在通用公共许可证和麻省理工学院双重许可下发布的开源软件。您可以在开源和商业软件中使用它。

Prerequisites:
    jQuery
    jQuery UI Core
    jQuery UI Widget
    jQuery mousewheel plugin (optional)