移动开发不同的手机如何弹出系统默认数字键盘

需求描述：电话输入表单，要求聚焦时弹出系统默认数字键盘，限制最大长度11位，只能输入数字，不能输入字母。

方案一：面对以上的需求我首先想到方案是给表单添加属性type="number" maxlength=11，结果发现输入11位数字后依然可以输入。

问题原因：根据MDN解释maxlength控制表单value的最大长度（最多字符数目），与其相关的属性包括type=password/search/tel/text/url这五种，并不会限制type=number的表单。

参考链接：maxlength

解决方案：给表单添加监听input事件方法：

<input type="number" οninput="if(value.length>11)value=value.slice(0,11)

方案二：既然maxlength可以控制其他属性表单的长度，那我第二个方案是给表单添加属性type="tel" maxlength=11，结果限制长度11位可以了，但是却可以输入字母，所以想到添加pattern=“[0-9]{11}”属性，规定用于验证输入字段的模式，结果却还是可以输入字母。

问题原因：partten属性不能控制键盘输入，只在表单提交的时候提示报错

<input type="tel" maxlength=11 pattern="[0-9]">
// 点击搜索的时候会弹出以下报错