使 <input type="text" /> 只有数字可以输入？ [复制]答案

【问题标题】：Make an <input type="text" /> only numbers are input-able? [duplicate]使 <input type="text" /> 只有数字可以输入？ [复制]
【发布时间】：2010-12-17 08:21:53
【问题描述】：

<input type="text" id="target" />

jQuery 怎么做？

【问题讨论】：

标签： javascript jquery input

【解决方案1】：

虽然由于使用了键码，所以有点脆弱......以下会更直观，因为它完全不可能输入非数字：

$("#target").keydown(function(event) {
    return ( event.keyCode < 32 ||                             // Control characters
             ( event.keyCode >= 48 && event.keyCode <= 57 ) || // Numbers
             event.keyCode == 127 );                           // Delete key
});

注意补充：这实际上不是最好的方法......因为（windows）ALT + [num] 132可以在框中输入ä。它应该与 keyup 事件结合，以确保没有输入任何字符，就像这样，Combined:

$("#target").keydown(function(event) {
    return ( event.keyCode < 32 ||                             // Control characters
             ( event.keyCode >= 48 && event.keyCode <= 57 ) || // Numbers
             event.keyCode == 127 );                           // Delete key
});

$("#target").keyup(function(event) {
    event.target.value = event.target.value.replace(/[^0-9]/g, "");
});

此外，这不适用于此处的 num-pad-numbers，因此它肯定比简单的 blur() 事件更脆弱。

【讨论】：

奇怪，它似乎对我不起作用，它只会停止一切（包括数字）
@Soufiane：如前所述，keydown() / keyCodes 非常脆弱。有关详细信息，请参阅unixpapa.com/js/key.html。

【解决方案2】：

$("#target").blur(function(event) {
    event.target.value = event.target.value.replace(/[^0-9]/g, "");
});

这也可以：

$("#target").keypress(function(event) {
    event.target.value = event.target.value.replace(/[^0-9]/g, "");
});

【讨论】：

我觉得应该是key up之类的吧？
问题是{^0-9]，应该是[^0-9]。
@jtbandes - 我一定要失明了。
我仍然可以输入一个字母，但只能输入一个。为什么？
使用 keyup 事件而不是 blur 或 keypress

【解决方案3】：

$('input[type=text].someclass').blur(function(event)
{
   event.target.value = event.target.value.replace(/[^0-9]/g, "");
});

【讨论】：

【解决方案4】：

function onlyNumbers(evt) {
    var e = evt;
    if(window.event){ // IE
        var charCode = e.keyCode;
    } else if (e.which) { // Safari 4, Firefox 3.0.4
        var charCode = e.which;
    }
    if (charCode > 31 && (charCode < 48 || charCode > 57))
       return false;
    return true;
}

Source

【讨论】：

【解决方案5】：

if (!$.browser.mozilla) {
    if (event.keyCode && (event.keyCode < 48 || event.keyCode > 57))
        event.preventDefault();
}
else {
    if (event.charCode && (event.charCode < 48 || event.charCode > 57))
        event.preventDefault();
}

【讨论】：

做减号的人应该解释为什么......