禁用日期输入框的键盘输入虽技术上可行，但违反 wcag 2.1 键盘可访问性标准，损害残障用户及键盘导航用户的使用体验，应优先通过无障碍友好的方式满足业务需求。
禁用日期输入框的键盘输入虽技术上可行，但违反 wcag 2.1 键盘可访问性标准，损害残障用户及键盘导航用户的使用体验，应优先通过无障碍友好的方式满足业务需求。
在 Firefox 中， 原生支持键盘输入（如手动键入 2024-05-20），而 Chrome/Safari 等浏览器默认更依赖日历弹出控件。开发者有时试图通过 readonly、onKeyDown 或 onInput 阻止键盘输入，但这些方案存在明显缺陷：
- readonly="true"：禁用所有文本输入，同时阻止 Firefox 的日历选择器触发（Firefox 不允许对只读日期输入框点击唤起原生日历）；
- event.preventDefault() 在 onKeyDown 或 onInput 中：在 Firefox 中常被忽略或行为不一致，尤其对 Enter、Tab、数字键等关键操作无效；
- pointer-events: none 或 user-select: none：仅影响样式层，无法阻止键盘聚焦与输入。
✅ 推荐的无障碍替代方案：
- 保留原生键盘输入能力（符合 WCAG 2.1 SC 2.1.1 Keyboard）；
-
增强输入验证而非禁用输入：
const handleDateChange = (e: React.ChangeEvent<HTMLInputElement>) => { const value = e.target.value; // 允许空值或符合 YYYY-MM-DD 格式的合法日期 if (!value || /^\d{4}-\d{2}-\d{2}$/.test(value)) { handleChangeInput(e, index, 'factStart'); } }; - 补充视觉提示（如图标+tooltip）引导用户使用日历，但不强制限制键盘路径；
- 如需完全自定义交互，应构建全键盘可访问的自研日期选择器（含 aria-haspopup, aria-expanded, role="dialog" 及完整 Tab/Arrow/Enter 支持），而非破坏原生语义。
⚠️ 注意：绕过原生 的键盘支持，不仅违反 WCAG（导致“键盘不可访问”失败），还可能引发屏幕阅读器兼容问题（如 NVDA/JAWS 无法正确播报日期格式）、表单自动填充失效，以及移动端软键盘异常。
总结：不要禁用键盘输入——而应拥抱它，并通过验证、提示与包容性设计确保所有用户都能可靠、高效地完成日期输入任务。
