input type="week" 的 value 必须严格为 ISO 8601 周格式字符串(如"2024-W23"),年份4位、大写W、周数两位且真实存在;JavaScript需手动计算ISO周,min/max也须同格式;后端解析须用ISO专用格式符,不可依赖通用日期解析。

input type="week" 的值不是“计算”出来的,而是必须严格按 ISO 8601 周格式写死
浏览器不接受任何“计算后自动转换”的逻辑——value 属性只认形如 "2024-W23" 的字符串。写错格式(比如 "2024-06-10"、"2024-W5" 或空字符串 "")会导致输入框显示为空或回退到当前周,且无报错提示。
关键约束有三个:
- 年份必须是 4 位数字(
"2024"✅,"24"❌) - 必须用大写
"W"连接,不能是小写"w"或其他分隔符 - 周数必须是两位数字(
"W01"✅,"W1"❌),且该周在对应年份中真实存在(例如"2024-W54"无效,因 2024 年只有 52 周)
JavaScript 动态设置 value 时,得自己算 ISO 周,别依赖 Date.prototype
new Date().toISOString()、toLocaleDateString() 都不返回周格式;getWeek() 方法不存在;直接拼 getFullYear() + "-W" + getMonth()+1 是典型错误——它算的是月,不是 ISO 周。
可靠做法是手动对齐到周四(ISO 周以周四为锚点),再推算:
立即学习“前端免费学习笔记(深入)”;
function getISOWeek(date) {
const d = new Date(date);
// 移动到本周四
d.setDate(d.getDate() + 4 - (d.getDay() || 7));
const yearStart = new Date(d.getFullYear(), 0, 1);
const weekNumber = Math.ceil(((d - yearStart) / 864e5 + 1) / 7);
return `${d.getFullYear()}-W${String(weekNumber).padStart(2, '0')}`;
}
<p>document.querySelector('input[type="week"]').value = getISOWeek(new Date());注意:这个函数返回的是字符串,不是数字。赋值前务必确认 DOM 已就绪(Safari 在 DOMContentLoaded 前设 value 可能被忽略)。
min/max 属性也必须是 ISO 周格式,否则静默失效
min="2024-01-01" 或 max="2024-12-31" 完全没用——浏览器会直接忽略,控制台也不报错。必须把起止日期先转成各自所属的 ISO 周:
- 用上面的
getISOWeek()函数处理任意日期(如getISOWeek(new Date("2024-06-01"))→"2024-W22") - 确保
min和max都补零、带"W"、年份正确(2025 年最大周是 W52,不是 W53) - 用户仍可能手动输入非法值(如
"2023-W00"),所以提交前必须用 JS 再校验value是否匹配/^\d{4}-W\d{2}$/且周数在合法范围内
后端解析 week 值不能靠 new Date(),得用专用格式符
前端传来的 "2024-W23" 字符串,JS 里用 new Date("2024-W23") 会得到 Invalid Date;Python 里用 strptime(value, "%Y-W%U") 也不对——%U 是从周日开始计的美国周,不是 ISO 周。
必须用 ISO 专用格式符:
- Python:
datetime.strptime("2024-W23-1", "%G-W%V-%u")(%G是 ISO 年,%V是 ISO 周,%u是周一为 1) - Node.js:
dayjs("2024-W23", "YYYY-WWW").toDate()(需启用customParseFormat插件) - PHP:
DateTime::createFromFormat("o-\WW", "2024-W23")(o是 ISO 年,\W转义字面 W)
最易被忽略的一点:不同年份的 ISO 周总数不同(2023/2024/2025 分别是 52/52/53 周),仅靠正则校验格式远远不够,必须查证周数是否真实存在。



















