ios safari 不支持 inputmode="decimal"，会降级为默认键盘；需用 type="text" + pattern="[0-9.]*" 触发带小数点的数字键盘，并配合 js 过滤非法字符。
inputmode="decimal" 在 iOS 上根本不会弹出带小数点的数字键盘
直接说结论：inputmode="decimal" 在当前（iOS 17.5 / Safari 17.5）仍不被支持——它会被 Safari 完全忽略，最终 fallback 到默认键盘（通常是字母键盘或 inputmode="numeric" 的纯数字键盘）。你输不了小数点，不是代码写错了，是系统压根没响应这个属性。
真正能触发「带小数点的数字键盘」的，只有 inputmode="numeric" + type="text" 组合，并配合 pattern="[0-9]*"（iOS 专属 hack），但仍有明显限制：
- iOS 仅在
type="text"下识别pattern触发数字键盘；type="number"反而会禁用小数点输入（尤其在微信内嵌 WebView） -
inputmode="numeric"在 Android Chrome 上表现正常，会弹出含小数点的数字键盘 -
inputmode="decimal"在 Chrome Desktop、Android Chrome 120+ 已支持，但 iOS Safari 至今无计划支持（Apple WebKit Bug #247169 仍 Open）
怎么让 iOS 用户能方便输入小数？绕过 inputmode 的实际方案
别依赖 inputmode，用组合策略保底：
- 用
<input type="text" inputmode="numeric" pattern="[0-9.]*">—— 多写一个inputmode="decimal"不影响，但关键靠pattern触发 iOS 数字键盘 - 监听
input事件，用正则过滤非法字符：value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1')，防止粘贴进多个小数点 - 对
type="number"做降级：iOS 下强制改回type="text"，再补上pattern和inputmode - 不要设
step="any"或step="0.01"—— iOStype="number"会直接屏蔽小数点键，哪怕你写了inputmode
为什么 type="number" 在微信和 Safari 里输不了小数点？
这不是 bug，是 WebKit 和微信 X5 内核的明确行为：当 type="number" 且未指定 step 或 step="1" 时，它们只允许整数输入；即使写了 step="0.1"，部分版本仍会忽略小数点按键（尤其是长按句号键不出小数点）。
典型现象：console.log(event.data) 拿不到小数点，input 事件也不触发。这时候强行用 JS 插入 . 会破坏光标位置，体验极差。
- 微信 iOS 客户端（X5 内核）对
type="number"的限制比 Safari 更严 - Safari 会把
type="number"渲染成带上下箭头的控件，但箭头操作无法精确到小数，反而干扰用户 - 唯一稳妥路径：放弃
type="number"，用type="text"+ 自行校验 + 格式化显示
要不要用 inputmode="decimal"？现在怎么写才不踩坑
可以写，但必须当成「增强提示」而非功能依赖。它的作用只是告诉支持的浏览器（如 Chrome Desktop）优先启用小数键盘，对 iOS 零影响。
- 推荐写法：
<input type="text" inputmode="decimal" pattern="[0-9.]*" maxlength="12"> - JS 校验必须同步做：
parseFloat(value) || 0转数值，再检查是否在合理范围内（比如金额不超 99999999.99） - 视觉上可加「￥」或「元」后缀，但别用
suffix属性（不存在），用伪元素或外层包裹更可控 - 如果项目需高精度小数（如科学计算），干脆上自定义软键盘组件，彻底摆脱系统键盘限制
最麻烦的从来不是写法，而是测试覆盖：iOS 各版本、微信各版本、QQ 浏览器、Chrome for iOS……它们对同一组属性的解析差异，比文档写的多得多。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
