Don't允许在<输入类型=数字/>

Don't allow typing alphabetic characters in a <input type=number />

本文关键字：类型 数字 输入 gt Don lt      更新时间：2023-09-26

我需要一个文本框，其中，无论何时在里面键入，都应该只允许数字[0-9]。我已经使用了type="number"，它肯定包含客户端验证，但也允许键入其他字母。我可以通过跟踪每个keydown并与regex匹配来做到这一点，但我想知道是否有任何方法可以限制我只使用html标记键入，而不在JavaScript中定义任何函数来比较每个keydown？

不足以做到这一点的代码是：

    <input type="number" id="txt_number" maxlength="70" name="txt_name" placeholder="Number">

感谢您的帮助。

您可以使用jquery.numeric插件。

请参阅这里有类似的问题。

$(document).ready(function(){
   $(".numeric").numeric();
});

试试这个

定义javascript函数

允许数字的函数，小数如下

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

只允许数字而非小数的函数如下

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

Html

<input type="number" id="txt_number" maxlength="70" name="txt_name" placeholder="Number" onkeypress="return isNumberKey(event)">

输入type="number"用于在移动设备上获取数字键盘

Java脚本

function numbersonly(myfield, e)
        {
            var key;
            var keychar;
            if (window.event)
                key = window.event.keyCode;
            else if (e)
                key = e.which;
            else
                return true;
            keychar = String.fromCharCode(key);
            // control keys
            if ((key==null) || (key==0) || (key==8) || (key==9) || (key==13) || (key==27) )
                return true;
            // numbers
            else if ((("0123456789").indexOf(keychar) > -1))
                return true;
            // only one decimal point
            else if ((keychar == "."))
            {
                if (myfield.value.indexOf(keychar) > -1)
                    return false;
            }
            else
                return false;
        }

Html

<input type="number" onkeypress="return numbersonly(this, event)"/>

浏览器的行为不同。在Chrome中，以下代码：

<input type="number" id="txt_number" maxlength="70" name="txt_name" placeholder="Number">
  <input type="submit">

只有在表单中并且只有在用户单击提交按钮后，才对您有效。

如果你不介意使用一点Javascript，这可能有助于JS-BIN Demo:

<input type="number" onkeyup="if(!this.checkValidity()){this.value='';alert('Please enter a number')};"/>

您必须将输入框放在表单中，并带有提交按钮。表单验证在提交表单时进行。请在此处查看演示：http://jsfiddle.net/ds345/Q4muA/1/

<form>Number:
    <input type="number" name="Number" value="10">
    <br>
    <input type="submit" value="Submit" />
</form>

试试这个：-

 $("#txtAge").keydown(function (e) {
       if(e.key=='e' || e.key=='.' || e.key=='-')
        return false;
    });

我注意到这个问题是在2013年左右发布的。无论如何，现在type="number"正在限制除"e"、"."之外的字母和特殊字符和'+'分别为'e'和'.'被认为是指数数，如1.2e+12被认为是十进制数。

只需添加-min="0"max="9"onkeydown="return false；"

<input type="number" id="txt_number" maxlength="70" name="txt_name" placeholder="Number" min="0" max="9" onkeydown="return false;">

相关文章：