如何在Android移动网站中强制使用带有数字键盘
问题的原因是希望在Android手机网站中强制使用带有数字键盘的键盘。解决方法是根据WHATWG规范使用inputmode
属性,并在iOS设备上添加pattern
属性。为了向后兼容,还可以使用type
属性。在Chrome版本66中,这些属性被支持。
具体的解决方法是在标签中添加以下代码:
<input inputmode="numeric" pattern="[0-9]*" type="number" />
感谢答案,我在这里找到了decimal
属性:developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/…
在移动网站的Android上如何强制使用带有数字的键盘的问题是由以下内容引起的:
重要提示
我将此内容发布为答案,而不是评论,因为这是非常重要的信息,并且以这种格式会吸引更多的注意力。
正如其他人指出的,您可以通过type="number"
/ type="tel"
强制设备显示数字键盘,但我必须强调您必须非常小心。
如果有人期望以零开头的数字,例如000222
,那么她可能会遇到麻烦,因为某些浏览器(例如桌面版Chrome)将222
发送到服务器,这不是她想要的结果。
关于type="tel"
,我无法说出类似的事情,但我个人不使用它,因为其在不同电话上的行为可能会有所不同。我只使用简单的pattern="[0-9]*"
,但在Android上不起作用。
自动重新格式化可能不会发生在type="tel"
上。规范指出,tel
不强制任何特定的语法,不像number
,它要求其值是有效的浮点数。
这有多糟糕?我们正在尝试加快移动客户的表单处理速度,这似乎是一个显而易见的解决方案,但我们也希望有可靠的解决方案。你提到了不使用这种方法的强烈警告。我想知道你能否详细解释一下?
_t,用户需要发送'000222'数据,但服务器端获取到的是'222'。您难道不认为这个功能完全失效了吗?服务器得到了错误的数据。
是的,我明白你的意思,但我的意思是:有多少用户会遇到这个问题?这在主要的移动浏览器(如Safari和Chrome)上是一个问题吗?你是怎么知道这是个问题的?有没有链接可以提供。我相信你,我只是想自己进行研究,还没有看到任何暗示这一点的东西,也许你可以指点我正确的方向。我们只是想看看我们的客户群是否不会从中受益。
_t,我认为对于这个警告来说,最好的例子是出生日期输入字段。您需要手动输入日期、月份和年份。是的,仍然有很多网站使用这种样式,而不是普遍使用的日期选择器。关于出生日期输入字段的问题是,当您以"0"开头时,例如08。
type=number
似乎是一个很好的解决方案,但在使用桌面浏览器时,输入字段上会出现上下箭头。幸运的是,我们现在可以使用CSS隐藏这些箭头:stackoverflow.com/a/22306944/1066234 - PS:然后您会遇到使用type=number
的下一个问题:stackoverflow.com/q/35315157/1066234