autocomplete属性本身不提升可访问性，必须与label、name、type协同使用才能被屏幕阅读器和浏览器正确识别；label缺失或for绑定错误会导致补全失效和读屏报错，autocomplete值须严格匹配WHATWG规范小写标准词（如email、tel），写错即被忽略。
autocomplete 属性本身不提升可访问性，但它和 label、name、type 一起用对了，才能让屏幕阅读器和浏览器补全逻辑都认得清字段用途。
label 缺失或绑定错误，补全和读屏同时失效
浏览器和读屏软件都依赖 label 的语义关联推断字段含义。没 label 或 label[for] 指向错误的 id，会导致 Safari 补全率骤降，NVDA/JAWS 也常报“未命名输入框”。
- 每个
input必须有唯一id，且label[for]精确匹配它 - 避免仅靠
placeholder提示，比如写placeholder="请输入手机号"而不配label，语义强度不够 - 动态渲染（React/Vue）时，别漏掉同步生成
id和label[for]，复制粘贴容易导致多个label绑同一个id
autocomplete 值写错，等于没写
WHATWG 规范只认小写、无下划线、无空格的标准 token。写成 autocomplete="Email"、autocomplete="user_email" 或 autocomplete="address"，Chrome 和 Safari 都直接跳过——既不填充，也不增强读屏识别。
- 姓名用
autocomplete="name"（不是fullname或first_name） - 邮箱必须是
autocomplete="email"（user-email、mail全无效） - 地址行用
autocomplete="street-address"（单写address不被识别） - 密码字段必须区分
autocomplete="current-password"和autocomplete="new-password"，混用会禁用整套密码管理器逻辑
type 和 autocomplete 不匹配，补全和键盘布局双崩
浏览器按 type 决定唤起什么键盘，按 autocomplete 决定填什么历史值。两者冲突时，补全可能失效，或键盘错乱。
立即学习“前端免费学习笔记（深入）”；
-
type="email"+autocomplete="email"→ 邮箱键盘 + 自动候选 ✅ -
type="text"+autocomplete="tel"→ Chrome 可能填，但 iOS Safari 常跳过 ⚠️ -
type="number"+autocomplete="postal-code"→ 数字键盘挡地址选择，Android 上易错乱 ❌ -
type="date"是autocomplete="bday"唯一生效前提；type="text"下该值完全被忽略
动态插入 input 时 autocomplete 容易被忽略
Chrome 要求 input 在页面初始 DOM 中存在、未被设过 value（哪怕设为空字符串），才会触发自动填充。JS 动态创建或 React/Vue 条件渲染后插入的 input，即使属性全对，也大概率不工作。
- 必须用
setAttribute('autocomplete', 'email')显式设置，不能靠 JSX/模板语法后补 - 避免在
useEffect或mounted里才加autocomplete，应确保首次渲染即带该属性 - SSR hydration 后若重设
value，会中断浏览器填充时机，宁可留空也不预填
最常被忽略的是：autocomplete 不是独立开关，它必须和 label、name、type、HTTPS、表单结构全部对齐，缺一环，补全和可访问性就掉链子。
