Question

在我的网站上，我有一个文本输入字段，以分钟和秒为单位接受时间，格式如下：

00:00

现在，如果用户键入以下内容：

00:61

我需要将其格式化（在“模糊”上）：

01:01

我看过像moment.js这样的插件，但他们似乎都无法进行这种时间格式化。

有没有人知道jQuery或JavaScript中的一种方法来实现这一目标？

Answer 1

您可以在blur事件上使用jQuery .val()方法来实现此目的。这是一个例子;

jQuery(function($) {
    $(document).on('blur', 'input', function(e) {
        $(this).val(function(i, val) {
            var timeParts = val.split(':'),
                totalSeconds = parseInt(timeParts[0], 10) * 60 + parseInt(timeParts[1], 10),
                minutes = Math.floor(totalSeconds / 60),
                seconds = totalSeconds - (minutes * 60);
    	    return [minutes < 10 ? 0 : '', minutes, ':', seconds < 10 ? 0 : '', seconds].join('');
        });
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="00:61">

Answer 2

一种方法：http://codepen.io/zvona/pen/BoRXgq

var input = document.querySelector('#input');
input.addEventListener('blur', function() {
  var values = '';
  input.value.split(':').reduce(function(a,b) {
    a = ~~a;
    b= ~~b;
    if (b >= 60) {
      a += ~~(b / 60);
      b = b % 60;
    }
    values += a +':'+ b;
    return b;
  });

  input.value = values;
}, false);

Answer 3

嗯，这可能不是你想要的，但也许最好使用像bootstrap timepicker这样的东西？

jQuery - 格式分钟和秒 - 00:00

3 个答案: