Question

我尝试使用jQuery和Igor Escobar的掩码插件（http://igorescobar.github.io/jQuery-Mask-Plugin/）在HTML中实现一个特殊的蒙版输入

我只需要编写数字[0-9]和以下转换：

输入

123456789

12345678

1234567

123456

desidered output：

123.456.789

12.345.678

1.234.567

123.456

有可能用这个插件来实现吗？还是存在另一种方式呢？感谢您阅读：）

修改

我使用另一个插件（Numeral.js）：http://numeraljs.com/

这是我的工作代码：

$("#myinput").blur(function() 
{
    this.value=numeral(this.value).format('0,0[.]00').replace(/\,/g, '.');
});

但是我不想在最后验证，即（onblur），有没有办法在飞行中做到这一点？ - 也就是说，逐渐验证（按键）。

Answer 1

你可能不需要一个库。我保留了jQuery，但它确实用来选择输入，所以你绝对可以轻易放弃它。

$("#myinput").keyup(function(){
  // prevent every character except numbers
  if(!this.value.slice(-1).match(/^[0-9]+\.?[0-9]*$/) ){
    this.value = this.value.slice(0, -1);
    return;
  }
  // remove the dots, split the string and reverse it
  var a = this.value.replace(/\./g, '').split('').reverse();

  // start from 3 and as long as there's a number 
  // add a dot every three digits.
  var pos = 3;
  while(a[pos] !== undefined){
    a.splice(pos,0,'.');
    pos = pos + 4;
  }  
  // reverse, join and reassign the value
  this.value = a.reverse().join('');
});

您可以自己尝试 here ，看看它是否能胜任。希望它有所帮助。

编辑：虽然上面的代码有效，但它有一些缺点，例如：

复制/粘贴时不起作用
不允许使用箭头键移动
即使您在中间插入数字，光标也会一直显示在输入的末尾。

正如我需要它完全支持这些案例一样，我在一个小脚本中进化了它，你可以在Github上找到它以及演示和测试规范。

Answer 2

$("#myinput").on('keyup keydown blur', function() {
    this.value=numeral(this.value).format('0,0[.]00').replace(/\,/g, '.');
}

特殊点掩码输入HTML-JavaScript

2 个答案: