H5调IOS数字键盘

H5调IOS键盘

H5开发记一次调IOS键盘踩过的坑

一个需求测试的时候需要调IOS带小数点的数字键盘

1.首先是这样改的

<input type="number"/>    

这样安卓的数字键盘可以调起来，但是IOS不行

2.在网上搜资料IOS调数字键盘需要加pattern

<input type="number" pattern="\d*"/>  

或者

<input type="number" pattern="[0-9]*"/>  

这样可以IOS就可以调起数字键盘，但是是纯数字的键盘，没有小数点

3.然后又继续想办法，就找到了inputmode这个标签，安卓也是同样可以调起来的

<input type="text" inputmode="decimal" />  

inputmode属性如下：

none：不显示屏幕键盘

<input type="text" inputmode="none" /> 

text：显示标准的本地键盘

<input type="text" inputmode="text" /> 

numeric：显示0-9的数字

<input type="text" inputmode="numeric" /> 

decimal：显示0-9的数字，小数点，减号可能显示可能不显示

<input type="text" inputmode="decimal" /> 

tel：显示数字*,#

<input type="text" inputmode="tel" /> 

search：确保键盘便于搜索，enter键

<input type="text" inputmode="search" /> 

email：保证键盘上有@符号，方便用户输入邮件