min和max属性仅对type为number、range、date、datetime-local、month、week、time的input生效；type="text"等不支持，浏览器忽略；需配合js校验与后端验证。
min 和 max 属性只对特定表单控件生效
不是所有 <input> 都支持 min 和 max。只有类型为 "number"、"range"、"date"、"datetime-local"、"month"、"week"、"time" 的输入框才真正解析并应用这两个属性。
常见错误是给 type="text" 或 type="tel" 加 min="0"，浏览器会忽略——它既不校验，也不限制输入，连警告都不会抛。
-
<input type="number" min="1" max="100">✅ 有效（含键盘输入和上下箭头） -
<input type="text" min="1" max="100">❌ 无效（属性存在但无行为） -
<input type="number" min="5">✅ 只设下限，允许无限大
用户仍可绕过 min/max 的前端限制
min 和 max 是纯 UI 层提示与基础拦截，不构成安全校验。用户能轻易通过以下方式突破：
- 禁用 JavaScript 后直接粘贴超范围数字（如
"999999"） - 用开发者工具修改
value属性或移除min/max - 提交时手动构造 POST 请求绕过表单
所以必须搭配 JavaScript 主动校验 + 后端二次验证。例如监听 input 或 change 事件检查 input.validity.rangeOverflow 或 input.validity.rangeUnderflow，再调用 setCustomValidity() 提示。
注意 number 类型的值类型与空值行为
<input type="number"> 的 value 是字符串，但解析失败时（如输入字母、空格、空值）会返回空字符串 ""，而非 NaN 或 null。这直接影响校验逻辑：
-
Number(input.value)对空字符串返回0，可能误判为合法值 -
input.value === ""才是判断“未输入”的可靠方式 -
input.checkValidity()在值为空时返回true（除非加了required），但超出min/max时返回false
推荐校验顺序：required → 是否为空 → 是否为有效数字 → 是否在 min/max 范围内。
日期类输入的 min/max 值格式必须严格匹配 type
type="date" 的 min 和 max 必须是 YYYY-MM-DD 格式字符串，不能是时间戳、Date 对象或任意字符串：
-
<input type="date" min="2024-01-01" max="2024-12-31">✅ -
<input type="date" min="Jan 1, 2024">❌ 浏览器忽略 -
<input type="datetime-local" min="2024-01-01T00:00">✅（需带T和时分）
格式错一个字符（比如少 T 或多空格），整个属性失效，且控制台通常不报错——只能靠手动测试确认是否起作用。
min/max 当成后端防线，以及混淆 value 的类型和空值表现。它们只是第一道轻量提示，真要稳，得靠 JS 主动读值 + 后端兜底。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
