Angularjs输入限制[重复]

Posted 2023-02-22

【中文标题】Angularjs输入限制[重复]

【英文标题】：Angularjs Input restriction [duplicate]

【发布时间】：2018-12-30 21:34:15

【问题描述】：

我在表单中有一个输入框，我希望用户只输入数字，数字的最大长度应为 10。

<input type="text" maxlength="10" ng-model="phoneNumber" class="form-control"/>

当我使用上述方法时，我可以将用户限制为 10 位，但用户可以输入字母。

<input type="number" ng-model="phoneNumber" class="form-control"/>

当我使用第二种方法时，用户只能输入数字，但我不能限制只能输入 10 位数字。

除了警告用户，还有其他选项可以结合这两个属性吗？

【问题讨论】：

最好在后端进行任何验证（用户始终控制前端）

根据经验，前端根据用户体验进行数据验证，后端根据安全性进行数据验证。两层都涉及验证，但类型不同。

【参考方案1】：

实际输入type=number只处理，如果输入的数字不在范围内，则不允许用户提交表单。

请参考：

How can I limit possible inputs in a html5 "number" element?

更多详情：

maxlength ignored for input type="number" in Chrome

HTML5 input number min max not working with required

【讨论】：

OP 要求只允许输入 10 位长数字。使用max="99999"（或ng-maxlength="10"），您可以输入任意数量的内容（即使它没有经过验证）。

***.com/questions/18510845/…

***.com/questions/18510845/… 看起来这个对我有用。谢谢！