input type="week" 的 min/max 必须用 iso 格式 yyyy-wnn（如 min="2024-w01"），不可用日期格式；需 javascript 动态计算合法周范围，兼容性差时应降级为双 date 输入或日历库。
input type="week" 的日期范围限制怎么写
原生 input type="week" 不支持直接用 min / max 限定“某年某月内”的周区间，因为它的值格式是 YYYY-Wnn（如 2024-W26），而浏览器对 min/max 的解析严格依赖该格式——填错格式（比如写成 2024-06-01）会导致约束完全失效，甚至清空输入。
正确做法是：手动计算起止周的 ISO 周编号，并确保格式为 YYYY-Wnn（nn 必须补零到两位）：
-
min="2024-W01"表示最早可选 2024 年第 1 周（2024-01-01 所在周） -
max="2024-W53"表示最晚可选 2024 年第 53 周（2024-12-30 起始的周） - 注意：2024 年有 53 周，但 2025 年只有 52 周；不能硬写
W53到所有年份
如何动态生成合法的 min/max 值（JavaScript）
靠人工查 ISO 周数不现实。需要用 JS 计算指定日期范围对应的首尾周 —— 关键是把任意日期转成它所属的 ISO 周（YYYY-Wnn），再取范围内最小/最大周。
核心逻辑：ISO 周一为每周第一天，且第 1 周必须包含当年至少 4 个星期四。可用以下函数生成：
function getISOWeek(date) {
const d = new Date(date);
d.setUTCDate(d.getUTCDate() + 4 - (d.getUTCDay() || 7)); // 转到最近周四
const yearStart = new Date(d.getUTCFullYear(), 0, 1);
const weekNumber = Math.ceil((((d - yearStart) / 86400000) + yearStart.getUTCDay() + 1) / 7);
return `${d.getUTCFullYear()}-W${String(weekNumber).padStart(2, '0')}`;
}
<p>// 示例：限制 2024-06-01 到 2024-09-30
const minWeek = getISOWeek(new Date('2024-06-01'));
const maxWeek = getISOWeek(new Date('2024-09-30'));
// → minWeek = "2024-W22", maxWeek = "2024-W39"
</p>
然后赋给 input：<input type="week" min="2024-W22" max="2024-W39">
用户选了超出范围的周，会怎样？
行为因浏览器而异，但共性是：不会自动修正，也不会报错，只会在提交时校验失败。比如在 Chrome 中，超出 max 的周仍可点选，但表单调用 checkValidity() 返回 false，且 reportValidity() 会弹出默认提示（如 “请在 2024-W22 和 2024-W39 之间选择”）。
容易踩的坑：
- 没监听
input或change事件做二次校验，导致后端收到非法值 - 用户手动编辑输入框内容（如改成
2023-W01），绕过 UI 限制 —— 此时min/max依然生效，但需 JS 主动检查value是否合规 - 服务端完全信任前端
min/max，没做 ISO 周合法性验证（如2024-W99是无效值）
兼容性和替代方案要注意什么
input type="week" 在 Safari 和旧版 Edge 中不支持（Safari 直到 iOS 16.4 / macOS 13.3 才支持），且 Android WebView 行为混乱。如果业务要求覆盖全平台，别只靠原生控件。
务实建议：
- 先用
input type="week"+min/max，再用Modernizr.inputtypes.week或document.createElement('input').type === 'week'检测支持性 - 不支持时降级为两个
input type="date"（起始日/结束日），或引入轻量日历库（如 flatpickr）并配置周选择模式 - 避免用 moment.js 处理 ISO 周 —— 它的
isoWeek()和isoWeekYear()易与原生行为错位；优先用原生Date+ 上述getISOWeek()函数
ISO 周的边界比自然月更难对齐，尤其跨年时（如 2024-12-30 属于 2025-W01），这个细节一旦忽略，min/max 就会漏掉或多拦一周。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
