Question

我需要一个在输入中键入两个数字后添加冒号（:)的函数，我在StackOverflow上找到this solution这也是我需要的。它在输入第二个数字后添加冒号，不会让你添加超过4个数字。

然而，有一个我无法理解和解决的问题。我需要删除所有数字，但它不会让我。我只能删除最后两个，你不能删除冒号。

以下是当前代码：

var time = document.getElementsByClassName('time');
for (var i = 0; i < time.length; i++) {
    time[i].addEventListener('keyup', function (e) {
        var reg = /[0-9]/;
        if (this.value.length == 2 && reg.test(this.value)) this.value = this.value + ":"; //Add colon if string length > 2 and string is a number 
        if (this.value.length > 5) this.value = this.value.substr(0, this.value.length - 1); //Delete the last digit if string length > 5
    });
};

https://jsfiddle.net/bubxm7pe/

Answer 1

您可以使用e.keyCode

添加退格条件

它有效here

if (e.keyCode != 8)
{
      var reg = /[0-9]/;
      if (this.value.length == 2 && reg.test(this.value)) this.value = this.value + ":"; //Add colon if string length > 2 and string is a number 
      if (this.value.length > 5) this.value = this.value.substr(0, this.value.length - 1); //Delete the last digit if string length > 5           
}

更新：您还可以使用以下数字限制用户。它也有效here

//called when key is pressed in textbox
$(".time").keypress(function (e) {

    //if the letter is not digit then don't type anything
    if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
         return false;
    }
    else
    {
        var reg = /[0-9]/;
        if (this.value.length == 2 && reg.test(this.value)) this.value = this.value + ":"; //Add colon if string length > 2 and string is a number 
        if (this.value.length > 4) this.value = this.value.substr(0, this.value.length - 1); //Delete the last digit if string length > 5 

    }

});

Answer 2

您可以检查按下的键是否为数字，而不是检查B D S B S D S B D S D B D S B D B S或delete：

backspace

https://jsfiddle.net/6jbaayqd/

Answer 3

由于您已经倾向使用regex，为什么不使用它来格式化input字段中的时间 - 请参阅下面的演示：

＆＃13;

document.getElementsByClassName('time')[0].addEventListener('keyup', function(e) {
  this.value = this.value
    .replace(/[^\d]/g, '') // allow only digits
    .replace(/^([\d]{4})\d+$/g, '$1') // restrict to 4 chars
    .replace(/\B(?=(\d{2})+(?!\d{1}))/g, ":"); // place the colon

});

＆＃13;

<input class="time" />

＆＃13;

无法删除动态添加的冒号

3 个答案: