autocomplete属性必须填w3c/whatwg标准语义值才真正生效，如email、tel、given-name、current-password等；填on/off、自定义值或大小写错误均被浏览器忽略，且需配合type、name及合规表单结构协同生效。
autocomplete 属性填什么值才真正生效
浏览器只认标准的 autocomplete 值，填错或自定义值（比如 autocomplete="myname"）基本等于没写。它不是“提示字段用途”的备注，而是向浏览器发出明确的语义指令，告诉它这个 input 该匹配哪类已保存的数据。
- 姓名类用
autocomplete="given-name"（名）、autocomplete="family-name"（姓）、autocomplete="name"（全名），不要用"name"指代昵称或用户名 - 邮箱必须是
autocomplete="email"，"mail"或"user-email"不起作用 - 密码字段要成对出现：
autocomplete="new-password"（注册/改密）和autocomplete="current-password"（登录），混用会导致填充异常 - 地址字段层级敏感：省市区需分别用
autocomplete="address-level1"、"address-level2"、"address-level3"，填"province"或"city"无效
为什么 autocomplete="off" 经常失效
现代浏览器（Chrome ≥ 76、Firefox ≥ 80、Edge ≥ 79）已忽略全局 autocomplete="off"，尤其对密码类字段。这不是 bug，是安全策略——防止网站禁用密码管理器。
- 若真需禁用自动填充（如动态生成的验证码输入框），可改用
autocomplete="nope"这类无意义值，部分浏览器会 fallback 到不匹配任何已存数据 - 更可靠的方式是重置
name和id属性（如name="verify_code_12345"），让浏览器无法关联历史表单 - 对密码字段强行设
autocomplete="off"可能触发浏览器警告，甚至自动启用密码生成建议
自动填充失败的三个典型 HTML 结构陷阱
即使 autocomplete 值正确，DOM 结构不合理也会让浏览器放弃识别。
-
input不在<form></form>内，或form元素缺失method和action（哪怕为空），部分浏览器拒绝触发填充 - 同一表单中多个
input的autocomplete值重复（如两个都设"email"），浏览器无法判断哪个是主邮箱，可能全部跳过 - 使用 JavaScript 动态移除/重建
input节点后未重置autocomplete属性，新节点失去语义上下文，填充逻辑失效
移动端 Safari 对 autocomplete 的特殊限制
iOS 16+ 起，Safari 要求表单必须满足更严格的条件才会显示自动填充按钮（右下角小钥匙图标）。
- 表单需有明确提交行为：
<form></form>必须包含<button type="submit"></button>或<input type="submit"> - 至少一个
input的autocomplete值属于核心类型（"email"、"tel"、"current-password"、"new-password"），其他如"organization"不触发 UI 提示 - 页面需通过 HTTPS 加载，HTTP 站点即使代码正确也不会显示填充入口
实际效果取决于用户是否已在系统设置中开启“密码自动填充”并授权对应网站，这点常被忽略——开发时测试机未开启对应开关，会误判为代码问题。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
