使用 HTML 输入类型的数字键盘显示

Posted

技术标签:

【中文标题】使用 HTML 输入类型的数字键盘显示【英文标题】:Numeric Keyboard display using HTML input type 【发布时间】:2015-08-23 07:59:12 【问题描述】:

由于用户在该字段中输入的大部分值仅是数字和符号,因此我有特定要求在 iPhone 和 android 移动设备上以文本输入字段为焦点显示数字符号键盘。但输入字段也可以接受字母字符。为了改善用户体验,我需要在字段焦点上显示数字符号键盘作为默认键盘。但是使用 html5 输入标签,我无法在 iPhone 和 android 中实现这一点。

Input type = text--> Alpha numeric keyboard in both ios and Android
Input type = tel and Input type = text with pattern as 0-9 --> Number dialer keypad in both iOS and Android
Input type = number --> Numeric symbol keyboard in iOS, Numeric Keypad in android.

根据 W3 标准,输入 type=number 将只接受带有小数点分隔符的数值。即使我们可以输入其他符号,也会在表单提交中发送无效数字。因此,输入类型 = 数字不是此要求的合适选项。

我想将图像中显示的第二个键盘作为默认键盘显示在输入字段的焦点上。由于我同时针对网页和厚应用程序,自定义键盘不是可行的解决方案。有没有人建议实现这一目标???

【问题讨论】:

【参考方案1】:

您不能在 Android 中强制使用特定布局。您可以告诉键盘类型,例如数字(Android 中有多种数字类型,但 html 不是那么丰富)。键盘是一个单独的应用程序,然后决定要显示的键盘。根据特定键盘认为最好的内容,它可能会显示 9 个键盘、单个数字行,甚至忽略您的请求。但是没有办法强制特定设计,也无法保证您的键盘甚至支持该设计。

此外,对于这样的事情,即使可行,自定义键盘也不是一个好的答案。用户不喜欢键盘被改变,如果你这样做,你最好有充分的理由。 “好吧,我更喜欢这种布局对于数字而言”不是一个好的理由。在这种情况下,您需要放弃该要求。

【讨论】:

感谢您提供详细信息。这个要求是为了增加用户体验,因为输入到字段中的值的 90% 只是数字和特殊字符。因此,我们不是默认显示字母键盘,而是尝试使用符号键盘显示数字作为默认键盘。我们面临的主要问题是通过混合应用程序实现的。

以上是关于使用 HTML 输入类型的数字键盘显示的主要内容,如果未能解决你的问题,请参考以下文章

如何在 android 的 EditText 上显示数字键盘?

使用 HTML5 input 类型提升移动端输入体验(键盘)

Android 软键盘:下一个按钮在 HTML5 数字输入之间不“跳动”

带有逗号的 iOS 数字键盘的输入类型

Javascript:如何用逗号显示iOs数字键盘

HTML5 输入类型号与电话