autocomplete值必须严格符合WHATWG规范小写标准token且在内才生效；大小写错误、拼写错误、脱离表单或误用off均导致失效；收货地址需加shipping前缀；验证码需one-time-code+隐藏submit按钮+HTTPS+合规短信模板；动态插入input须用setAttribute及时设置；效果依赖用户本地历史记录。
直接写对 autocomplete 值，浏览器才真会填；写错、大小写偏差、拼写错误或脱离 <form></form>，等于没写。
autocomplete 不是开关，是语义标签
它不控制“开/关”，只告诉浏览器“这个框该匹配哪类历史记录”。设成 autocomplete="user-email" 或 autocomplete="Email"，浏览器直接忽略——WHATWG 规范只认标准小写 token，比如 email、given-name、street-address。
常见误用包括：
-
autocomplete="off"用在密码框上基本无效（Chrome ≥76、Safari、Edge 都会无视） -
type="text"+autocomplete="email"虽能工作，但不如type="email"+autocomplete="email"稳定 - 字段不在
<form></form>内，哪怕属性全对，浏览器大概率跳过填充
收货地址字段必须加 shipping 前缀
填错前缀会导致浏览器把账单地址填进收货栏，或完全不触发。正确写法是显式标注用途：
立即学习“前端免费学习笔记（深入）”；
-
autocomplete="shipping tel"（收货人电话） -
autocomplete="shipping street-address"（街道地址） -
autocomplete="shipping address-line2"（如楼号、单元） -
autocomplete="shipping postal-code"（邮编） -
autocomplete="shipping country"（国家）
省市区字段目前无强制标准值，可暂用 autocomplete="shipping address-level1"（省）、autocomplete="shipping address-level2"（市），但不要留空字段——跳过某一级比填空更安全。
验证码输入框要配 one-time-code + 隐藏 submit 按钮
仅加 autocomplete="one-time-code" 不够，iOS Safari 和 Android Chrome 都要求完整上下文：
- 输入框必须在
<form></form>内，且表单中至少有一个<button type="submit"></button>（哪怕display: none） - 推荐用
type="text"+inputmode="numeric"，避免type="number"在 iOS 上唤出带小数点的键盘 -
name值需语义化，如name="otp"，不能是name="input1" - 页面必须走 HTTPS，否则 Chrome 直接禁用该功能
后端短信模板也得配合：iOS 要求形如【品牌名】您的验证码是 123456。Android Chrome 认 [[123456]]。二者缺一不可。
动态插入 input 时 autocomplete 容易丢失
React/Vue 渲染、JS 动态创建 <input>、SSR 后 hydration，都容易让 autocomplete 属性被抹掉或延迟设置。
关键动作：
- 用
setAttribute('autocomplete', 'email')设置，别用input.autocomplete = 'email'（反射行为不一致） - 插入 DOM 后立刻设属性，不能等事件循环或状态更新后再补
- SSR 页面中若 hydration 后清空了
value，务必确认没连带删掉autocomplete属性
最常被忽略的一点：autocomplete 的效果高度依赖用户本地已有保存的记录。新用户、隐身模式、首次访问域名，都不会触发填充——这不是代码问题，是浏览器策略。
