数字软键盘的兼容

表单输入框要求输入电话号码,弹出一个数字软键盘了,比较好的解决方案如下:

1.type="tel", 是 HTML5 的一个属性,表示输入框类型为电话号码,在 Android 和 IOS 上表现差不多,都会有数字键盘,但是也会有字母,略显多余。

2.pattern="[0-9]", pattern 用于验证表单输入的内容,通常 HTML5 的 type 属性,比如 email、tel、number、data 类、url 等,已经自带了简单的数据格式验证功能了,加上 pattern 后,前端部分的验证更加简单高效了。IOS 中,只有 [0-9]\* 才可以调起九宫格数字键盘,\d 无效,Android 4.4 以下(包括X5内核),两者都调起数字键盘。

3.novalidate="novalidate",novalidate 属性规定当提交表单时不对其进行验证,由于 pattern 校验兼容性不好,可以不让其校验,只让其唤起纯数字键盘,校验工作由 js 去做。


你可能感兴趣的:(数字软键盘的兼容)