时间戳

首页 > 解决方案 > 使用正则表达式验证 2dp 十进制值

jquery - 使用正则表达式验证 2dp 十进制值

问题描述

到目前为止，我的代码有效，但是当设置了两个小数时，我无法输入任何数字。知道有什么问题吗？

$("input").keypress(function(e) {
  var el = $(this);
  var key = e.keyCode || e.which;
  key = String.fromCharCode(key);
  var value = el.val() + key;
  var regex = /^\d+(,\d{0,2})?$/;
  if (!regex.test(value)) {
    e.returnValue = false;
    if (e.preventDefault) e.preventDefault();
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" value="1234,56">

标签： jqueryregex

解决方案

您的代码还将拒绝退格键、删除键和箭头键，这将使用户几乎不可能更正已经存在的数字。

我建议不要响应事件，keypress而是响应input事件，因为它也会在通过鼠标（拖入文本）、上下文菜单（清除、粘贴）或其他输入设备进行更改时触发。

不同之处在于input在进行更改后触发，但这还不错。您可以删除不符合正则表达式的输入部分：

$("input").on('input', function(e){
    var clean = $(this).val().replace(/^(\d+(,\d{0,2})?)?.*/g, "$1");
    $(this).val(clean);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" value="1234,56">

上述解决方案删除了​​违反模式的字符之后的其余输入。如果您想保留尽可能多的输入字符，您可以执行一个循环，一次只删除一个违规字符：

$("input").on('input', function(e){
    var clean = $(this).val(), input;
    while (input != clean) {
        input = clean;
        clean = input.replace(/^(\d+(,\d{0,2})?)?.?/g, "$1");
    }
    $(this).val(clean);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" value="1234,56">

推荐阅读