必须在label中明文写入“（必填）”或“*”，同时设置required和aria-required="true"，并配合aria-invalid="true"及aria-describedby提供错误反馈，否则盲人无法获知必填规则与校验状态。
aria-required="true" 单独写，盲人根本听不出“必填”
只加 aria-required="true" 而不加原生 required，NVDA、VoiceOver 或 TalkBack 大概率只读“邮箱”“姓名”，不会带“必填”二字。它不是“增强播报”，而是“可能被忽略”的弱信号——尤其在旧版 JAWS + IE 或某些 Android WebView 场景下，压根不触发播报。
原因很简单：aria-required 是纯语义标记，不绑定任何 DOM 状态变化，也不影响 label 文本内容。读屏器靠的是 label 文本 + ARIA 属性协同解析，缺一环就断链。
- 必须同时写
required和aria-required="true"（后者可省略，但显式写出更稳妥） - 如果 label 里没出现“必填”“*”或等效文字，
aria-required="true"就像贴了张无声标签——读屏器看不到上下文，不敢擅自添加语义 - 禁用
aria-label="必填"这种写法：它会覆盖原字段名，导致读屏只报“必填”，用户不知道是哪个框
label 里不写“(必填)”，等于对盲人隐瞒规则
浏览器原生 required 属性本身不修改 label 渲染，也不注入任何文本。屏幕阅读器读到的，永远只是你写的 label 原文。所以 ，读出来就是“手机号”，不是“手机号（必填）”。
最直接有效的做法，就是把“必填”明文塞进 label 里：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 用中文习惯后置：
- 星号可选，但必须是真实 DOM 节点：
，且*要加aria-hidden="true"防止重复朗读 - 若 label 文本由 i18n 动态生成，确保翻译包里也包含“（必填）”或对应本地化表述（如英文 “(required)”）
- 绝对不要依赖 CSS
::after生成星号——它不在 DOM 中，读屏器完全不可见
动态表单中 aria-required 切换必须同步操作
条件必填字段（比如“选择‘其他’时，下方输入框变为必填”）容易出问题：JS 改了 required，却忘了同步 aria-required，或者反过来。结果是读屏播报和浏览器行为不一致——用户听到“必填”，但提交没拦截；或反之。
- 启用必填时：先设
input.required = true，再设input.setAttribute('aria-required', 'true') - 禁用必填时：设
input.required = false，再设input.setAttribute('aria-required', 'false')（不能直接removeAttribute，否则部分读屏仍按默认false解析，但状态变更可能不被感知） - 避免写
aria-required=""或aria-required="1"—— 这些值无效，NVDA 可能跳过整个字段 - 验证是否生效：用 VoiceOver（macOS）或 NVDA（Windows）聚焦该字段，听完整播报；再清空提交，确认是否触发浏览器原生提示
错误状态必须配 aria-invalid="true"，否则“必填”变摆设
用户漏填后，仅靠红框或 Toast 提示，盲人完全感知不到错误。即使 label 写了“（必填）”，没明确告诉读屏“现在这个字段错了”，用户就不知道要回头补什么。
- 校验失败时，立刻设
input.setAttribute('aria-invalid', 'true') - 错误文案需有唯一 ID，并用
aria-describedby="error-phone"关联，例如：请填写手机号 - 校验通过后，**必须同时移除**
aria-invalid和aria-describedby，否则旧错误提示会残留，干扰后续操作 - 别把错误信息塞进
placeholder：输入开始就消失，且不被所有读屏器识别为错误描述
实际落地时，最容易被跳过的不是代码怎么写，而是每次新增字段、每次国际化切换、每次用 JS 动态插入表单项，都得重新检查 label 文本 + required + aria-required + 错误状态这四者的同步节奏。一个环节脱节，对盲人来说就是信息黑洞。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
