Brad Frost 讲述了他最近使用 <input type="number"> 的网站体验。
上周，我接到银行的电话，询问我刚刚安排的一笔电汇。客户支持人员让我重复所有信息，因为信息似乎有问题。“嗯，除了账户号码的后三位数之外，你说的所有内容都正确。”
他让我重新提交电汇表单。当我退出账户号码字段时，我眼角注意到账户号码发生了细微的变化。我迅速将焦点重新放在该字段上，并在我的妙控鼠标上稍微向上移动了食指。它开始看起来更像老虎机而不是输入字段！
Brad 认为我们不应该将 <input type="number"> 用于“账户号码、社会安全号码、信用卡号码、确认号码”，我觉得很有道理！相反，我们可以使用 Chris Ferdinandi 在之前的一篇关于 HTML 中的约束验证 的文章中提到的 pattern 属性。
值得一提的是，数字输入可能比看起来更复杂，并且它们的 外观和行为在不同浏览器之间有所不同。在评估用户体验时，需要考虑 Brad 的建议以及所有这些因素。
此外
<input inputmode="numeric"> 是移动设备数字键盘的未来方向（与 iOS 上的 `pattern="[0-9]*"` 配合使用，等待 inputmode 支持）。
注意：仅限正整数！https://#/R9WuwXy106 https://#/2HiSq4ZXK0
— Zach Leatherman (@zachleat) 2019年3月25日
使用 type=tel
Matt，这实际上不起作用。
type=tel不会强制执行任何类型的输入值，并且账户号码实际上不是电话号码，因此在语义上没有意义（在考虑可访问性时很重要）Zach Leatherman 在页面上的推文中提供的答案是正确的，并且将提供最佳的用户体验。在具有屏幕键盘的移动和平板设备上，将向用户显示数字键盘。在这些相同的设备和台式机上，
pattern将确保只有数字输入才能通过验证。账户号码、电话号码、邮政编码等实际上不是数字，而是数字字符串。应该保留给真正的数字，即可以进行数学运算的事物。
对于日期字段（类型为文本，因为我不需要使用本机日期选择器），我将 inputmode 设置为 numeric，这在 Android 设备上完美运行，因此我有了数字键盘，但在 iOS 上却不一样，如果有人有想法，我仍在寻找解决此问题的方案。
谢谢
我不明白，输入字段发生了什么？？？