step属性控制合法值的步长基准，与min/max共同定义等差数列集合；浏览器不拦截非法输入，仅在提交验证或读取valueasnumber时生效。
input type="number" 的 step 属性到底控制什么
step 不是“限制用户只能输整数”，而是定义合法值的步长基准，配合 min 和 max 共同构成一个等差数列集合：{min, min + step, min + 2×step, …}。浏览器数字键盘（如 iOS Safari 的数字键盘、Android Chrome 的 number 键盘）只负责提供输入入口，**不主动校验或拦截非法值**；真正起作用的是表单提交时的原生约束验证，或 JS 手动读取 valueAsNumber 时的解析逻辑。
为什么设了 step="1" 还能输入小数
这是常见误解。只要没加 min/max 或没触发验证，用户完全可以通过软键盘直接输入 "3.14" —— 浏览器不会阻止。只有在以下情况才会生效：
- 用户点击上下箭头按钮（
type="number"自带的微调器），此时值严格按step增减 - 表单提交时触发
checkValidity()，若当前值不在合法序列中（如min="0" step="1" value="2.5"），会报错"The value must be a valid number." - JS 中访问
input.valueAsNumber，非法值返回NaN（例如step="1"但输入"2.3"）
step="any" 和 step="0.01" 的实际区别
两者都允许小数，但行为不同：
-
step="any"：禁用原生数值校验，valueAsNumber仍可解析合法浮点数（如"1.234"→1.234），但提交时不检查是否符合步长 -
step="0.01"：要求所有合法值必须是百分位对齐的数（如1.00、1.99、2.00），1.005或1.001都算非法（即使显示正常） - 注意浮点精度问题：
step="0.1"在二进制下无法精确表示，可能导致valueAsNumber出现0.30000000000000004这类结果
移动端数字键盘不会因 step 改变按键布局
iOS 的 type="number" 键盘始终显示数字+小数点+负号，Android 各厂商键盘也基本一致。它**不根据 step 动态隐藏小数点键**——哪怕你设了 step="1"，用户依然能点出小数点并输入 "5." 或 "7.0"。真正需要整数输入，得靠组合手段：
- 加
pattern="\d*"+inputmode="numeric"（增强提示，非强制） - 监听
input事件，用正则过滤掉小数点：input.value = input.value.replace(/\D/g, '') - 提交前用
Math.round(parseFloat(input.value))强制取整（但要注意空值和 NaN）
最易被忽略的一点：step 对键盘本身毫无影响，它只参与数值合法性判定。想靠它“锁死”输入类型，必须搭配 JS 校验或服务端兜底 —— 浏览器永远信任用户输入的字符串，直到你明确去解析或验证它。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
