首页 > 解决方案 > 要限制的文本字段(+-0-9%)

问题描述

有一个文本字段可以接受以下内容的场景, 10,+10,-10,+10.00,-10.00,+10.00%,-10.00%.

我可以使用 RegEx 检查模式pattern="[-+]?[0-9]+(\.[0-9]{0,4})?%?"

但要求是限制用户在字段本身中输入错误字符,而不是抛出错误。

角度版本 - 1.6

标签: javascriptangularjs

解决方案


我会自己做简单的方法和使用,

<input type="number" min="-10" max="10" />

然后只需向用户表明他正在此字段中插入百分比。也适用于移动用户。

否则我可能会构建某种状态机并为不同的解决方案构建 json 结构。然后只需在正则表达式上运行它。

document.getElementById('input').addEventListener('keydown',function(event){
  event.preventDefault();
  var stateTree = {
   0 : ['-','+','[0-9]'],
   ... //  basicly declare here possible regexp's per length
   5 : ['[+|-]10\.0']  // could be doing quiet specific one's
  };

  var text = this.value +''+ event.key;
  var array = stateTree[text.length];
  array.map( function(item){
    const match = new RegExp(item, 'g');
    if( text.match(match) ){ this.value = text }
  });

})

推荐阅读