如何限制用户在输入元素中键入10位数字？

Question

我想为电话号码创建一个输入字段.我正在动态地使用JavaScript创建输入字段.

<input type="text" id="phone" name="phone">

如何限制用户只键入10位数字以获取电话号码.

Answer 1

试试这个

<input type="text" name="country_code" pattern="[1-9]{1}[0-9]{9}"> 

这将确保

1. 这是数字
2. 最多10个字符
3. 第一个数字不为零

Answer 2

使用 maxlength

<input type="text" maxlength="10" />

Answer 3

您可以maxlength用来限制长度。通常，对于数字输入，您会使用type="number"，但是这会增加一个细框框的内容来滚动数字，这对于电话号码完全没有用。但是，您可以使用该pattern属性将输入限制为数字（如果需要，还需要10个数字）：

<input type="text" maxlength="10" pattern="\d{10}" title="Please enter exactly 10 digits" />

Answer 4

好吧,我已成功创建了自己的工作答案.

<input type="text" id="phone" name="phone" onkeypress="phoneno()" maxlength="10">

以及

    <script>        
           function phoneno(){          
            $('#phone').keypress(function(e) {
                var a = [];
                var k = e.which;

                for (i = 48; i < 58; i++)
                    a.push(i);

                if (!(a.indexOf(k)>=0))
                    e.preventDefault();
            });
        }
       </script>