我需要 javascript 中的持续时间选择器答案

【问题标题】：I need a duration picker in javascript我需要 javascript 中的持续时间选择器
【发布时间】：2015-07-09 06:48:42
【问题描述】：

我需要一个 javascript 中的持续时间选择器比如在天：时：分：秒。

天、时、分、秒的四个文本框

【问题讨论】：

这不是问题。
你有没有尝试过？请发布您尝试过的内容。
我查看jsfiddle.net/xHzMw/1
但是当我从键盘更改值时它不起作用
您能否提供一张图片或链接到您正在寻找的示例？持续时间是什么？倒数/倒数？你需要澄清你在问什么以及到目前为止你已经尝试过什么

标签： javascript jquery

【解决方案1】：

对于days字段，只需复制其他字段的格式并将值从60更新为24即可。

但正如您提到的从键盘更改值，您应该选择form events 或keyboard events 来执行此操作。在这个演示中，我选择了blur 事件，因为它会在输入失去焦点时触发。

$("input[name='value']").blur(function() {
     var id = $(this).prop('id');
     $("#" + id).spinner('stepUp');
     $("#" + id).spinner('stepDown');
 });

添加键盘事件后，应考虑用户输入数字超过 60 秒。有一个例子，在您的原始代码中，如果用户在second 字段中输入130，它将更新为1 minute and 70 seconds，而不是2 minutes and 10 seconds。

您可以使用mod 来解决这个问题。

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

这里是Jsfiddle。

【讨论】：