firefox 不支持原生 ，回退为文本框，导致 change 事件不触发、valueasnumber 返回 nan、step 无效；需降级自定义组件，并服务端校验时间格式。
time 输入框在 Chrome 和 Safari 中能直接用，但 Firefox 不支持
HTML 原生 <input type="time"> 在 Chrome、Edge、Safari（macOS/iOS）中表现稳定，可唤起系统时间选择器；Firefox 则完全回退为文本输入框，不提供任何 UI 控件。这意味着靠它做表单验证或交互逻辑时，必须额外处理兼容性。
常见错误现象：input[type="time"] 在 Firefox 中无法触发 change 事件（因为用户没“选”，只是手动输），valueAsNumber 返回 NaN，且 step 属性无效。
- 若业务强依赖时间选择体验，需对 Firefox 用户降级为自定义组件（如
select或第三方库） - 服务端永远不要信任前端
value格式，必须校验并解析为合法HH:MM或 ISO 时间片段 - 使用
min/max属性时，值必须是HH:MM格式（如min="09:00"），不能带秒或时区
设置 step="300" 让时间粒度控制到 5 分钟
step 属性决定时间选择器的最小步进单位（单位：秒）。默认是 60（1 分钟），设为 300 即 5 分钟，600 是 10 分钟，1800 是半小时——注意不是毫秒，也不是分钟数字。
容易踩的坑：step="5" 没有意义，浏览器会忽略；step="300" 在 Firefox 中完全无效（因无原生控件）；iOS Safari 对 step 支持不稳定，有时仍显示 1 分钟粒度。
- 仅当
type="time"有原生支持时，step才起作用 - 若需更细粒度（如 15 秒），必须放弃原生控件，改用 JS 实现
- 配合
value使用时，初始值也需符合step对齐（如step="300"时，value="09:05"合法，value="09:07"可能被截断或报错
用 valueAsDate 避免字符串解析错误
读取 <input type="time"> 的值时，value 返回字符串（如 "14:30"），而 valueAsDate 返回一个 Date 对象（日期部分固定为 1970-01-01）。后者更适合做时间计算或比较，避免手写正则或 split(":") 出错。
但要注意：valueAsDate 在用户未输入/输入非法格式时返回 null，不是 undefined；且它不包含时区信息，始终按本地时区解释。
- 推荐写法：
const timeDate = input.valueAsDate; if (timeDate) { const mins = timeDate.getMinutes() + timeDate.getHours() * 60; } - 不要用
new Date(input.value)，因为"14:30"不是标准日期字符串，各浏览器解析结果不一致 - 提交前若需转成后端要求的格式（如
"14:30:00"），应基于valueAsDate构造，而非拼接value
移动端键盘弹出问题：iOS Safari 默认弹数字键盘
iOS Safari 对 type="time" 的实现是：点击后弹出时间滚轮，但焦点仍在输入框，导致软键盘可能意外弹出（尤其在页面缩放或 CSS 覆盖时）。更糟的是，某些版本会先弹数字键盘，再跳转到时间选择器，造成两次交互。
解决思路不是禁用，而是引导行为：
- 加
readonly属性可阻止键盘弹出，但需用 JS 绑定点击事件来主动触发showPicker()（Chrome 112+ 支持） - 不要给
input设inputmode="numeric"，这会强化数字键盘倾向 - 在 iOS 上，确保父容器没有
transform或scale，否则滚轮定位偏移，用户点不到确认按钮
真正难处理的是老版本 iOS（showPicker()，只能监听 focus 后立即 blur() 并用自定义 UI 替代——这点常被忽略，直到线上用户反馈“点不动”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
