javascript - 要限制的文本字段(+-0-9%)
问题描述
有一个文本字段可以接受以下内容的场景,
10,+10,-10,+10.00,-10.00,+10.00%,-10.00%
.
我可以使用 RegEx 检查模式pattern="[-+]?[0-9]+(\.[0-9]{0,4})?%?"
。
但要求是限制用户在字段本身中输入错误字符,而不是抛出错误。
角度版本 - 1.6
解决方案
我会自己做简单的方法和使用,
<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 }
});
})
推荐阅读
- chart.js - angular chartjs 折线图默认选项
- google-chrome - Google Chrome IndexedDb 奇怪的物理空间管理
- flutter - Flutter,很多StatefulWidget会不会有问题?
- python - 我无法在情节中制作地图
- filter - 在 pandoc 过滤器中返回 el.content 的文本字符串
- reactjs - 路由 - Reactjs - 只有第一个路由有效
- javascript - 使用 RTL 语言环境格式化的日期格式不正确
- mysql - MYSQL - 具有限制并按两个字段分组的有序查询
- apache-spark - Pyspark Dataframe 到 3d Numpy 矩阵
- jquery - Shopify 购买按钮 - 使图像可点击