记忆:input[number] 的 step 相对 min 递增(原生提示 JS 拦不到)+ 通配守卫

This commit is contained in:
tamakyi
2026-10-12 18:13:44 +08:00
parent 9c76437a76
commit d795c6b579
2 changed files with 30 additions and 0 deletions
+9
View File
@@ -1228,6 +1228,15 @@ HTML,一行里必然带 `</script>`,一拒就把正常用法挡死了(我
小坑:半径输入框得套一层**定宽容器**(`.area-km-box`)——站点全局 input 规则是
`width:100%` 且带 10 个 `:not()`(特异性 (0,11,1)),直接给 input 写宽度压不过。
⚠️ **`<input type="number">` 的 `step` 是相对 `min` 递增的**,不是「`step` 的整数倍」:
`min=0.05` + `step=0.5` 的合法值只有 0.05/0.55/1.05…,用户填 3 或 3.5 会被 Chrome 判非法、
提交时弹「请输入有效值。两个最接近的有效值分别为 2.55 和 3.05」。**这是浏览器原生提示,
JS 与后端都拦不到**(我们的校验根本没机会说话)——只能在源头避免。
⇒ 要么 `step="any"`(交给 JS/后端校验),要么让 `min` 是 `step` 的整数倍。
`min`/`max` 可以留着(真实边界 + spinner 范围)。守卫 `TestNumberInputStepNeverMismatchesMin`
扫**所有**模板的数字框(不是只盯出问题那个),JS 动态建的另有
`TestTopicAreaRadiusInputAllowsAnyStep`。
`topic-areas.js` 只把**纯函数**暴露给 node 单测,另加最小测试钩子 `api._map`
供无头验证(同 `window.rondMap._state` 惯例)—— 不留把手就只能真拿鼠标点地图。