防止在移动设备上的输入字段中输入小数位答案

【问题标题】：Prevent decimal place being entered into input field on mobile防止在移动设备上的输入字段中输入小数位
【发布时间】：2018-05-27 17:52:46
【问题描述】：

我有这个 javascript 代码，它在桌面浏览器上运行良好，可以确保用户只能输入字符 1 到 9。

但是，在 Android 上的 Chrome 中进行测试时，显示的小键盘包含字段接受的破折号和句点字符。我怎样才能防止这种情况发生？

    function isNumberKey(evt) {
        var charCode = (evt.which) ? evt.which : evt.keyCode;
        if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;
        return true;
    }

更新：

这就是我在 HTML 中使用函数的方式：

  <input type="number" class="form-control" 
         onkeypress="return isNumberKey(event)" />

我有另一个功能可以防止将非数字字符复制并粘贴到代码中。

    $(document).ready(function() {
        $('#number').bind("cut copy paste drag drop", function(e) {
            e.preventDefault();
        });     
    });

如果一切都失败了，还有服务器端验证。

我真的很想阻止前端出现小数位。请记住，我指定的字符范围在 qwerty 键盘上限制了这一点 - 但是在 android（可能还有其他）上，数字键盘允许输入 . 和 -

【问题讨论】：

如果你想要的只是数字，为什么不明确检查 48 - 57 的范围呢？不知道为什么 31 支票在那里
你能告诉我们你在什么事件绑定中使用这个方法吗？
@Taplar 是否允许退格？我已经更新了答案以提供更多详细信息

标签： javascript android jquery html google-chrome

【解决方案1】：

一种可能的解决方案：

<script>
function onlyNumbers(num){
   if ( /[^0-9]+/.test(num.value) ){
      num.value = num.value.replace(/[^0-9]*/g,"")
   }
}
</script>
<input type="text" onkeyup="onlyNumbers(this)">

【讨论】：

谢谢，我稍后再查

【解决方案2】：

尝试使用 HTML 属性 min 和 max 来设置数字的范围，并使用 type=number 来只允许数字。

Quantity (between 1 and 5): <input type="number" name="quantity" min="1" max="5">

【讨论】：

这将允许他们放置 1.1、1.1111、4.9876 等 - number 的输入类型也无助于我的问题。我已经在使用它了。如您所见，取消非数字字符的按键需要额外的 javascript。
啊，是的，我误解了这个问题！