将jquery-inputmask用于从右到左的时间输入掩码

时间:2019-05-04 08:44:19

标签: jquery jquery-inputmask

当用户在字段中键入数字时,我试图使用jquery-inputmask来掩盖用户的输入:

1 => 1                     #                        1 second
12 => 12                   #                       12 seconds
123 => 1:23                #            1 minute,  23 seconds
1234 => 12:34              #           12 minutes, 34 seconds
12345 => 1:23:45           # 1 hour,   23 minutes, 45 seconds
123456 => 12:34:56         # 12 hours, 34 minutes, 56 seconds

1.23 => 1.23               #                        1.23 seconds
12.34 => 12.34             #                       12.34 seconds
123.45 => 1:23.45          #            1 minute,  23.45 seconds
1234.56 => 12:34.56        #           12 minutes, 34.56 seconds
12345.67 => 1:23:45.67     # 1 hour,   23 minutes, 45.67 seconds
123456.78 => 12:34:56.78   # 12 hours, 34 minutes, 56.78 seconds

但是我运气不好。

到目前为止,我最好的是:

# inputmasks/time.coffee
@Inputmasks.Time = class @Time extends @Inputmasks.Inputmask
  constructor: (input) ->
    @input = input

  mask: ->
    @input.inputmask '[9{2}:]9{0,2}',
      placeholder:     "0"
      showMaskOnHover: false
      greedy:          false
      rightAlign:      false
      numericInput:    true

这给了我以下功能:

1 => 1                     #                        1 second
12 => 12                   #                       12 seconds
123 => 1:23                #            1 minute,  23 seconds
1234 => 12:34              #           12 minutes, 34 seconds

如果我尝试使用此模式'[9{2}:][9{2}:]9{0,2}'(只需将有效内容重复几分钟),它就会分解为4位数字:

1 => 1                     #                        1 second
12 => 12                   #                       12 seconds
123 => 1:23                #            1 minute,  23 seconds
1234 => 1:2:34             # WRONG

我尝试了许多变体,但似乎无法正确处理。

我在使用可选的小数位数方面也遇到了麻烦。我试过其他示例中的语法,但是它们不能正常工作。例如,此模式'[9{2}:]9{0,2}[.9{0,2}]'执行以下操作:

1 => 1       # 1 second
12 => .12 .  # WRONG
122 => 1.23  # WRONG
...          # Continues to be wrong

我很茫然。似乎无法弄清楚。任何帮助,将不胜感激。不必是inputmask插件。我愿意使用任何效果很好的东西。

0 个答案:

没有答案