Question

我在这里尝试了一些解决方案，但是所有这些归结为输入输入后删除非数字输入。

此解决方案适用于数字： https://jsfiddle.net/HkEuf/17470/

但是它不允许小数。

我必须对其进行如下编辑，但仍然不允许使用小数：

    $(document).ready(function () {
      //called when key is pressed in textbox
    
          $("#quantity").keypress(function (e) {
             //if the letter is not digit then display error and don't type anything
             if (e.which != 110 && e.which != 190 && e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57 )) {
                //display error message
                $("#errmsg").html("Digits Only").show().fadeOut("slow");
                       return false;
            }
           });
        });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="quantity" id="quantity" />

Answer 1

您可以使用HTML来完成所有操作，您需要做的就是将number type与step属性一起使用。

注1：：通过添加required属性，我们可以在提交时验证字段，否则除非字段中有输入，否则它不会被验证。
注意2：：数字类型还支持min和max
注释3：支持IE 10+和所有其他主要浏览器

<form>
  <input type="number" step="0.001" name="quantity" id="quantity" required>
  <p><input type="submit" value="Numbers Only!"></p>
</form>

防止输入“ E”键

我们可以使用e事件来阻止keydown键，如果e.key == 'e'可以阻止该键：

Array.from(document.querySelectorAll('[type=number]')).forEach(i => {
  i.addEventListener('keydown', function(e) {
    if(e.key == 'e') e.preventDefault()
  })
})

<form>
  <input type="number" step="0.001" name="quantity" id="quantity" required>
  <p><input type="submit" value="Numbers Only!"></p>
</form>

Answer 2

在这里，我已经在您的jsfiddle参考中添加了一些代码，以允许使用十进制数字并阻止用户输入“。”符号两次。这是完整的代码

$(document).ready(function () {
//called when key is pressed in textbox
  $("#quantity").keypress(function (e) {
        var tempInput = $("#quantity").val()
            if(tempInput.split(".").length >= 2 && e.which == 46)
                return false;  //To check whether user has entered dot symbol before
             //if the letter is not digit then display error and don't type anything
             if (e.which != 110 && e.which != 46 && e.which != 190 && e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
                //display error message
                $("#errmsg").html("Digits Only").show().fadeOut("slow");
                       return false;
            }
   });
});

如果有任何问题，请随时提问。

P.S：我假设您使用“。”表示浮点数的符号

Answer 3

$(document).ready(function () {
    //called when key is pressed in textbox

    $("#quantity").keypress(function (e) {
         // If it's not a digit then display error and don't type anything
         if (e.which == 46 || e.which == 8 || e.which == 0 || (e.which > 48 && e.which < 57 )) {
             // Validate count of decimal separators
             var dSCount = ($(this).val().match(/\./g) || []).length;
             if (e.which == 46 && dSCount > 0) {
                 // Display error message
                 $("#errmsg").html("Only one decimal separator allowed").show().fadeOut("slow");
                 return false;
             }
        } else {
            // Display error message
            $("#errmsg").html("Digits Only").show().fadeOut("slow");
            return false;
        }
    });
});

输入有可能以点结尾，您也必须对此进行验证（可以在提交表单之前简单地删除尾随的十进制分隔符）。

Javascript将文本字段限制为数字和小数？

3 个答案:

防止输入“ E”键