最稳的组合是type="tel"+inputmode="numeric"（手机号/验证码）、type="email"+inputmode="email"（邮箱）、type="search"+inputmode="search"（搜索框）、type="text"+inputmode="decimal"（金额/评分），而type="number"应避免使用。
input 的 type 属性本身就能触发键盘，但“精准控制”这事，光靠 type 不够——它常被浏览器或系统覆盖、降级，甚至在 iOS 上引发副作用（比如 type="number" 禁粘贴、吞前导零）。真正能稳住键盘类型的，是 type 和 inputmode 的组合，且必须按场景选对值。
哪些 type + inputmode 组合在真机上最稳
不是所有组合都生效，也不是所有设备都认。经过多机型实测（iOS 16.4+、Android Chrome 120+、华为/小米/OPPO 系统输入法），以下组合实际弹出率高、行为一致：
-
type="tel"+inputmode="numeric"：手机号、验证码等纯数字场景首选。双保险——type="tel"触发拨号键盘基础布局，inputmode="numeric"强制优先显示数字键（iOS 上比单独用inputmode="numeric"更可靠） -
type="email"+inputmode="email"：邮箱字段。单独type="email"在部分安卓机上仍弹全键盘，补inputmode="email"后 @ 和 . 键出现概率显著提升 -
type="search"+inputmode="search"：搜索框。回车键文字变为“搜索”，且部分 Android 系统会联动 UI（如搜索栏高亮） -
type="text"+inputmode="decimal"：金额、评分等带小数点的输入。避开type="number"在 Safari 中把小数点转逗号、value 被隐式转 Number 的坑
为什么 type="number" 在移动端几乎不该用
它名义上该弹数字键盘，但实际问题集中：
- iOS Safari 会禁用长按粘贴、屏蔽负号和 e 字符，导致用户无法输入 -10 或 1e3
- 输入 0123 会被自动转成 123（前导零丢失），手机号或编号类字段直接废掉
- 键盘上小数点不总出现（尤其旧版 iOS），
inputmode="decimal"才是更可控的提示 - 表单提交时 value 类型不稳定：
type="number"的valueAsNumber可能为NaN，而value是字符串，容易引发类型判断错误
inputmode 值选错的典型现象
写对了属性名，但值不对，结果就是“写了等于没写”：
- 用了
inputmode="number"：这不是标准值，Chrome 和 Safari 都忽略，应换为inputmode="numeric"或inputmode="decimal" - 写了
inputmode="url"：虽在规范中，但当前主流移动浏览器基本不响应，键盘仍是默认文本键盘 -
type="text"+inputmode="tel"：语义断裂，自动填充可能失效，且部分输入法不识别该组合 -
inputmode="none"加在普通输入框上：键盘不弹，用户点进去没反应，体验断层；它只适合自定义键盘场景，且需配合 JS 焦点劫持
真机验证比模拟器重要十倍
Chrome DevTools 的模拟器会“假装支持”很多 inputmode 值，但真实行为取决于：
- 操作系统版本（iOS 16.4 是分水岭，此前
inputmode基本无效） - 厂商定制输入法（vivo/OPPO 系统常忽略
inputmode，小米相对好些） - 是否由用户手势触发聚焦（
.focus()必须在click或touchend回调里调用，否则无效）
别信“写了就生效”，每个组合上线前必须拿 iPhone、华为、小米各测一遍——键盘类型、小数点可见性、回车键文字、粘贴是否可用，缺一不可。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
