jQuery 如何调用“持续时间选择器”,它是否存在?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17428387/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 19:02:52  来源:igfitidea点击:

How's a "duration picker" called and does it exist?

javascriptjquerytime

提问by Francesco Belladonna

I'm looking for something like a "duration picker". Because googling "duration picker" doesn't give me any result, I would like to know if there is a technical name for it which can help in searching it. Time picker and Time Span picker doesn't bring anything helpful at the moment.

我正在寻找类似“持续时间选择器”的东西。因为谷歌搜索“持续时间选择器”没有给我任何结果,我想知道是否有一个技术名称可以帮助搜索它。时间选择器和时间跨度选择器目前没有带来任何有用的东西。

If something similar exists and someone can point me to that, it's ok instead of the technical name.

如果存在类似的东西并且有人可以指出我,那可以代替技术名称。

Update 1:

更新 1:

Sorry I completely forgot to explain what I mean by duration picker. It's not a time picker, but a way to choose how much time will last doing something, not relative to a date. For example, cooking a given recipe will take (duration) 4 hours and 10 minutes. Traveling from here to there will take 4 days and 10 hours.

抱歉,我完全忘记解释持续时间选择器的含义。它不是时间选择器,而是一种选择做某事将持续多长时间的方式,而不是相对于日期。例如,烹饪给定的食谱将需要(持续时间)4 小时 10 分钟。从这里到那里需要4天10小时。

My basic idea is the possibility to configure the picker for the "bigger" unit to use (days probably), the duration will be expressed in seconds internally. So I can say 20 days and 23 hours and 0 minutesor if the "bigger" unit is days (for a software development job for example), I can write 150 hours and 30 minutes and 0 seconds. It would be nice the option to hide some smaller fields, like minutes/seconds.

我的基本想法是可以为“更大”的单位配置选择器以使用(可能是几天),持续时间将在内部以秒表示。所以我可以说,20 days and 23 hours and 0 minutes或者如果“更大”的单位是天(例如,对于软件开发工作),我可以写150 hours and 30 minutes and 0 seconds. 隐藏一些较小的字段(例如分钟/秒)的选项会很好。

Update 2:

更新 2:

A very simple ui example: enter image description here

一个非常简单的用户界面示例: 在此处输入图片说明

采纳答案by naXa

Bootstrap Duration picker - Github, npm.

Bootstrap 持续时间选择器 - Githubnpm

Dependencies: jQuery and Bootstrap 3 (for styling only).

依赖项:jQuery 和 Bootstrap 3(仅用于样式)。

demo screenshot

演示截图

回答by havarc

You could use a set of customized jQuery spinners

您可以使用一组自定义的 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;
         }
     }
 });

like this: http://jsfiddle.net/xHzMw/1/

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

回答by Brett Jeffreson

I know this question is old, but it seems like a satisfactory answer wasn't reached. I made a jQuery plugin for this exact use case, i'll post it for anyone that comes looking in the future like I did.

我知道这个问题很老,但似乎没有得到满意的答案。我为这个确切的用例制作了一个 jQuery 插件,我会把它发布给任何像我一样在未来寻找的人。

https://github.com/Tartarus762/jquery-duration-picker

https://github.com/Tartarus762/jquery-duration-picker

回答by ekerner