<input type="text">？我刚意识到 HTML5 中的 <input type="number"> 是用于“浮点数”，因此不适用于信用卡号码、邮政编码等。<input type="number"> 的数字键盘功能，用于接受除浮点数以外的数字值。也许还有其他适当的 input 类型吗？截至2015年中期，我认为这是最佳解决方案：
<input type="number" pattern="[0-9]*" inputmode="numeric">
这将为您在Android和iOS上提供数字键盘：
同时，它还为您提供了预期的桌面行为，包括上下箭头按钮和友好的上/下箭头键增量：
在此代码片段中尝试一下：
<form>
<input type="number" pattern="[0-9]*" inputmode="numeric">
<button type="submit">Submit</button>
</form>通过将type="number"和pattern="[0-9]*结合使用，我们可以得到一个在任何地方都适用的解决方案。而且，它还能与未来的HTML 5.1提出的inputmode属性兼容。
注意：使用模式将触发浏览器本地表单验证。您可以使用novalidate属性禁用此功能，或者您可以使用title属性自定义验证失败时的错误消息。
如果您需要输入前导零、逗号或字母（例如国际邮政编码），请查看这个略有不同的变体。
致谢和更多阅读：
http://www.smashingmagazine.com/2015/05/form-inputs-browser-support-issue/ http://danielfriesen.name/blog/2013/09/19/input-type-number-and-ios-numeric-keypad/
<input type="text" inputmode="numeric">，并且它希望移动浏览器查看inputmode以确定它是否显示数字键盘或全键盘。由于没有浏览器支持inputmode，我不确定它将如何在桌面和移动浏览器上实现。例如：桌面浏览器是否允许在<input type="text" inputmode="numeric">中输入字母？如果是这样，那就有问题了。<input type="number">可以防止这种情况，只允许输入数字。也许我们必须等到浏览器开始实现它，然后我们才能更新这个答案。 - Aaron GrayThis attribute applies when the value of the type attribute is text, search, tel, url, email, or password, otherwise it is ignored. - Michael Laffargue您可以使用 <input type="text" pattern="\d*">，这将导致数字键盘出现。
有关更多详细信息，请参见iOS 的文本、Web 和编辑编程指南。
<form>
<input type="text" pattern="\d*">
<button type="submit">Submit</button>
</form>\d*无效，需要使用[0-9]。请注意，这将与 type='numeric' 一起使用。根据链接的文档参考邮政编码，建议使用此方法。 - Brett Ryan我发现，至少对于类似“密码”的字段，使用<input type="tel" />这样的方法会生成最真实的数字字段，而且它还具有无自动格式化的优点。比如，在我最近为希尔顿开发的一个移动应用中，我最终选择了这种方式：
......我的客户印象非常好。
<form>
<input type="tel" />
<button type="submit">Submit</button>
</form>number 类型的输入会强制使用严格的数字规则。如果用户添加空格（或逗号）以分隔千位数，您将无法从输入中获取任何值。是的，在 JavaScript 中，input.value 也将为空。tel 类型的输入不限于特定的格式，因此用户仍可以输入任何内容，并且验证是一个单独的过程（由开发人员处理）。 - Nux<input type="text" inputmode="numeric">
使用Inputmode，您可以向浏览器提供提示。
在某些手机上，如iPhone上使用type="email"或type="url"会给你提供一个特定的键盘。而对于电话号码，可以使用type="tel"。
截至2020年
<input type="number" pattern="[0-9]*" inputmode="numeric">
在这方面，CSS Tricks做了一篇非常好的文章：https://css-tricks.com/finger-friendly-numerical-inputs-with-inputmode/
使用 <input type="text" pattern="\d*"> 来唤起数字键盘存在风险。在Firefox和Chrome浏览器中，pattern属性中所包含的正则表达式会导致浏览器对输入内容进行验证。如果输入内容不符合该模式或为空，则会出现错误。请注意其他浏览器中可能会发生意外的行为。
我认为最好的解决方案是：
对于整数，可在 Android 和 iPhone 上唤出 0 到 9 的数字键盘
<label for="ting">
<input id="ting" name="ting" type="number" pattern="[\d]*" />
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type=number] {
-moz-appearance:textfield;
}
如果您正在进行自定义验证，请在表单元素中添加novalidate='novalidate'。
提示：如果您确实需要浮点数，请按照所需精度进行调整，Android将添加“。”。
<label for="ting">
<input id="ting" name="ting" type="number" pattern="[\d\.]*" step="0.01" />
我认为在语义化网页中，type="number" 是最好的选择。如果你只想改变键盘类型，可以使用 type="number" 或者 type="tel"。在这两种情况下，iPhone 不会限制用户输入。用户仍然可以输入（或粘贴）任何字符。唯一的变化是显示给用户的键盘。如果你需要更多的限制，就需要使用 JavaScript。
type="number" 是用于浮点数的。type="text" 是用于字符串的。你真正想要的是整数。我认为浮点数比字符串更接近整数。你觉得呢？ - Cat Chen有一种简单的方法可以实现这种行为（例如，如果我们想在输入字段中使用文本格式，但仍然希望显示数字键盘）：
我的输入：
<input inputMode="numeric" onChange={handleInputChange} />提示：如果你想要这种行为（逗号分隔数字），那么请按照 handleInputChange 的实现方式进行操作（这是基于 React 的，所以也提到了状态）
