HTML5 输入类型和触摸设备键盘：适当的数字、电话和文本用法？

Question

我想在触摸设备上为邮政编码和社会保险号输入字段自动启动数字键盘。邮政编码以五位数格式输入，而 SSN 以 111-22-3333 输入。我的理解是 type=number 和 type=tel 字段会自动启动适当的键盘，所以这些输入看起来很合适，但我不确定它们是正确的选择。

Type=Number

我最初认为 type=number 将是最佳解决方案（因为它在语义上听起来是正确的），但后来发现这种类型实际上只适用于真数字而不是数字字符串。我看到博客文章自动指责浏览器，包括逗号作为千位分隔符，并在提交时去除前导零（两者都不适合 zip/ssn）。

Type=电话

根据我的阅读，这似乎是解决我的问题的最佳方法。不过，我担心这种新类型的含义。我真的应该使用电话字段作为邮政编码和 ssn 吗？如果某些手机制造商决定开始显示 tel 字段的地址簿怎么办？这对于 zip 或 ssn 来说毫无意义。

替代品

我发现 type=text 输入的新模式属性可用于触发 iOS 设备上的数字键盘，但这只能部分解决问题。

我还发现了一个新属性inputMode，这似乎是理想的解决方案，但似乎还没有被任何浏览器实现。

问题

我希望有人提出建议或最佳做法？我应该使用电话吗？我应该使用 iOS 解决方案并忽略其他设备吗？ inputMode 会起作用吗？

Answer 1

我的建议是只使用模式和输入模式。 此外，如果您只接受 0-999 之间的整数，并且您可以接受将要完成的额外验证，则 Type = number 是可以接受的——即使用户单击取消也是如此。

Type=Number 即使是数字也会有问题，更不用说 SSN 等了，因为它对负数、本地化、精度、前导零等值的处理具有不可预知的处理能力，具体取决于浏览器的实现。最佳做法是避免，除非您有一个具有固定用户群的内部网站，您知道所使用的设备/区域设置 - 除非您期望 0 到 999 之间的整数。负数、小数和千位字符都会有问题某些设备。 此外，如果您使用“类型”，即使用户单击取消按钮，页面也会验证数据。您可以全局关闭验证，但现在页面将在回发时自动删除任何无效数据！如果您可以接受其中任何一个，则可以使用“类型”。

Type=Tel '今天'工作，但正如您所指出的，使用它是危险的，因为谁知道浏览器将来会做什么。更不用说这些设备甚至不接受“122-222-2223 Ext.34”。如果是电话号码，我会建议谨慎，否则请避免。即使 HTML5 规范不允许，某些设备仍决定验证数字的那一天可能会到来。

Pattern=... 很好添加。大多数浏览器都会忽略它，因此也可以使用另一个验证器，但至少更新的 iOS 设备会使用它，这占移动用户的 45%。

InputMode=... 似乎是此时唯一的其他希望。希望以后能得到支持。