空格键输入使用 regex.replace 擦除数据答案

【问题标题】：Space key input erases data with regex.replace空格键输入使用 regex.replace 擦除数据
【发布时间】：2019-02-25 12:36:27
【问题描述】：

我搜索了三天多的解决方案。我找到了一个堆栈答案Stack Ans 和他的 JSFiddle JSFiddle，它 100% 用于桌面，99% 用于移动版本。示例代码：

<input type="text" class="numeric" />
$('.numeric').on('input', function (event) { 
   this.value = this.value.replace(/[^0-9]/g, '');
});

在手机中查看jsfiddle链接并自己测试，测试用例：输入值12345，然后按spacebar twice它removes 5，再按两次空格键removes 4。如何解决？

以下代码在桌面浏览器中有效，而在移动浏览器中无效，因为无法识别密钥代码。

$(".numeric").on("keypress", function (event) {
   if ((event.which < 48 || event.which > 57)) event.preventDefault();
});

测试视频记录： Video Log Bug Report

【问题讨论】：

我在 Android 的 Chrome 浏览器中对此进行了测试，按空格键时没有遇到问题。您使用什么移动浏览器和手机进行测试？
我在 iOS 上测试过，没有遇到任何空间问题...
@DougF，我的手机是Redmi 4，Chrome，先输入数字为123456789012，然后一直按空格键。您会注意到该操作导致退格事件。我想给你看屏幕录像有什么想法可以和你分享吗？
我在手机上又试了一次，但没有遇到您遇到的问题。当我按下空格时，什么也没有发生。我只能在文本框中输入数字。我确实注意到引用的 JQuery 是 1.9.x，它已经很老了，所以也许你可以用更新的 JQuery 脚本创建一个新的小提琴，看看它是否有效。
@DougF，我在 w3schools URL(w3schools.com/code/tryit.asp?filename=G1J24SFCF8V4) 下使用更新的 jquery 版本 3.3.1 进行了尝试，但同样的问题仍然存在。我想分享我的手机录屏。

标签： jquery regex

【解决方案1】：

我找到了解决问题的方法，

$('.NumOnly').on('input', function (event) {
if (this.value.indexOf(' ') < 0) {
    this.value = this.value.trim().replace(/[^0-9]/g, '');
    if (!CheckLength(event.target.maxLength, $("#" + event.target.id).val())) {
        event.returnValue = false;
        return false;
    }
}
else this.value = this.value.trim();
});

我使用indexOf(' ') 检查输入值是否有空间。如果结果 >= 0，则 trim() 为值，否则 replace 使用基于正则表达式的验证。

【讨论】：