logo标签列表

“时长选择器”应该怎么称呼？它存在吗？

javascriptjquerytime
42
我正在寻找类似于“持续时间选择器”的东西。因为搜索“持续时间选择器”没有任何结果，我想知道有没有一个技术名词可以帮助搜索它。目前，“时间选择器”和“时间跨度选择器”没有带来任何有用的东西。
如果存在类似的东西并且有人可以指向那个东西，那就可以代替技术名称。
更新1：
很抱歉我完全忘记解释我所说的持续时间选择器的含义。它不是时间选择器，而是一种选择做某事需要多长时间的方法，与日期无关。例如，按照给定的食谱烹饪将花费（持续时间）4小时10分钟。从这里到那里旅行需要4天10小时。
我的基本想法是可能性配置选择大单位使用（可能是天），持续时间在内部以秒表示。所以我可以说20天23小时0分钟或者如果“较大”的单位是天（例如软件开发工作），我可以写150小时30分钟0秒。如果可以隐藏一些较小的字段（如分钟/秒钟），那么就更好了。
更新2：
一个非常简单的UI示例： enter image description here
1
看一下旋钮 http://anthonyterrien.com/knob/ 或者 Bootstrap 时间选择器 http://jdewit.github.io/bootstrap-timepicker/ - Reinstate Monica Cellio
1
@Archer：抱歉，我更新了问题以解释我所说的“持续时间选择器”的含义。 - Francesco Belladonna
@James：它们可以是小部件的一部分，但不是小部件本身。而且我不知道最大值（如果一个工作需要2000小时，而我设置了100小时的最大值怎么办？） - Francesco Belladonna
@Bergi：这是不同的问题，他正在询问如何将秒（持续时间）转换为可读格式，而我正在寻找一种良好的方式来以人类格式输入持续时间到表单中，并且应该以秒为单位由服务器接收。基本上，这是相反的情况。 - Francesco Belladonna
1
我刚刚发现了这个链接，可以用来改进并融入更加用户友好的解决方案： http://blog.nparashuram.com/2009/10/duration-input-component.html - James
显示剩余4条评论
5个回答
15

您可以使用一组自定义的jQuery旋转器

 $('#seconds').spinner({
     spin: function (event, ui) {
         if (ui.value >= 60) {
             $(this).spinner('value', ui.value - 60);
             $('#minutes').spinner('stepUp');
             return false;
         } else if (ui.value < 0) {
             $(this).spinner('value', ui.value + 60);
             $('#minutes').spinner('stepDown');
             return false;
         }
     }
 });

像这样：http://jsfiddle.net/xHzMw/1/

在网上搜索后，我得出了相同的答案。谢谢。 - Francesco Belladonna
2
这并不是非常健壮的。例如您可以在那些微调框中输入10小时和30535分钟。 - Joris Mans
6
5

Bootstrap时长选择器 - Github, npm。

依赖项：jQuery和Bootstrap 3（仅用于样式）。

演示截图

0
与上面的解决方案存在相同的问题。允许您在分钟字段中输入任意大的数字。 - Joris Mans
1
那有关系吗？如果用户知道值为4320分钟并且不想将其转换为小时，则可以输入分钟数。例如，机器运行时间可能以小时或分钟为单位。听起来像是一个功能；）不过，如果您输入的时间大于59分钟，则自动转换为时分秒格式会更好。我会在旁边加上这个功能。 - ekerner
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接