Question

我找到了this question。但是，大多数答案都会截取按键，检查键码，如果不是可接受的键码，则停止事件。

这有一些问题。

所有答案中的常见错误是不会阻止Shift键组合，因此用户可以输入“@”或“＆amp;”之类的内容。
用户仍然可以从剪贴板中粘贴错误值。
当你开始搞乱按键事件时，网页会开始做一些奇怪的，意想不到的事情。例如，如果该字段具有焦点，并且用户尝试通过按command-R重新加载页面，则无效。或者他们不能跳出现场。

我想要一个允许按键的解决方案，然后根据正则表达式检查输入的值并删除不需要的字符。

我正在寻找这些方面的解决方案：

不拦截按键事件。
理想情况下，在按键后使用正则表达式。
好吧，如果它使用jQuery。
不需要安装插件。

我试过这个功能：

  $('input.numerals_only').keypress(function() {
    var v = $(this).val();
    var no_nonnumerals = v.replace( /[^0-9]/, '' );
    $(this).val(no_nonnumerals);
  });

但这不起作用。我仍然可以输入信件。

有关它为什么不起作用的任何信息？我怎么能修改它才能起作用？其他建议？

Answer 1

你的正则表达式遗漏的东西，这也就是它不能用于按键的原因，是全局正则表达式检查的g标志。

使用var no_nonnumerals = v.replace( /[^0-9]/g, '' );

Answer 2

如果你使用keyup并且模糊，你应该处理大多数情况。有人在文本中键入，如果他们将值粘贴到文本框中。由于模糊功能也会删除不良值。

$('input.numerals_only').keyup(AllowOnlyNumber).blur(AllowOnlyNumber);

function AllowOnlyNumber()
{
    var v = $(this).val();
    var no_nonnumerals = v.replace(/[^0-9]/g, '');
    $(this).val(no_nonnumerals); 
}

当然，如果html5是一个你可以随时做的选择：

<input type="number"/>

jsfiddle示例。

Answer 3

如果您使用keyup代替keypress，则会始终删除不正确的字符。

您也可以使用它来实际阻止事件：

$('input.numerals_only').keypress(function(event) {
    if(event.keyCode < 48 || event.keyCode > 57){
        return false;
    }
});

Answer 4

使用keyup事件。它在浏览器处理密钥后触发：

$('#txtInput')
    .keyup(function(ev) {
        var newValue = this.value.replace(/[^0-9]/, '');
        $(this).val(newValue);
    });

Answer 5

我写了一个jQuery插件来做到这一点。这里的演示和代码http://brianjaeger.com/process.php

它使用正则表达式来验证您想要的任何内容。

有一些问题：

它是一个插件（但是，如果你愿意的话，你可以把代码吸掉并插入到你的其他JavaScript中.-更容易用作插件）
不幸的是，没有办法直接限制粘贴信息（在所有浏览器中） - 我的解决方案是在焦点变化和按键上添加验证。

如何防止非数字输入文本字段？

5 个答案: