android - 检测移动设备的屏幕键盘中的键是否可用

Question

我正在向我们的网站添加一些移动可用性优化。作为其中的一部分，我正在调整文本字段的类型属性，为用户提供预期数据类型的最佳输入工具。

我在触摸屏移动设备上遇到的一个问题是，不同操作系统上的浏览器，甚至同一操作系统上的不同浏览器，在使用 input type="number"时显示不同的屏幕键盘。

iOS 4.3.3 (iPhone 4) 上的 Safari 和 Android 2.3.4 上的 Chrome 包括小数点，但 Android 2.3.4 上的 Firefox 没有。

我尝试在 Firefox 中添加 step 属性 (step="0.1")，但没有任何改进。

如果我无法显示小数点，我将需要向 Firefox 显示完整的 QWERTY 键盘，这显然不会带来最佳的用户体验。它还提出了浏览器/设备嗅探的问题。要么我需要将 QWERTY 设置为默认设置，并向我实际可以测试的少数设备显示数字键盘，要么将数字小键盘设置为默认设置，然后在我知道这会中断的设备上切换回 QWERTY，后一种选择远没有那么健壮，因为我无法在所有制造的设备上进行测试。

测试对 input type="number"的支持并不能解决问题，因为显然浏览器确实支持该元素，它只是没有提供足够的键盘选项来输入所有数字类型。

所以..我想知道是否有人知道一种方法来测试浏览器/操作系统分配给输入类型的键盘中某个键(例如小数点)的存在，和/或是否有其他人有一些更好的建议，因为我对移动设备还很陌生。

我还应该提一下，我在这里使用的是 JavaScript，因为这是一个网站，而不是 native 应用程序。

谢谢:)

Answer 1

很遗憾，firefox 不支持数字输入类型。但是，您仍然可以尝试使用这些额外的 HTML 属性使输入字段提示用户输入数字

inputmode='numeric' 
pattern='[0-9]*'  //this makes it show only the numbers 0-9 without all the slashes and dashes and everything. Ignore this if that's not what you want