html输入框autocomplete是语义提示而非开关，需严格匹配whatwg规范：密码框用current-password/new-password，姓名拆为given-name/family-name，邮箱用email，手机用tel，邮编用postal-code，且type与autocomplete须协同生效，动态渲染字段需服务端直出并置于form内。
HTML 输入框的自动完成（autocomplete）不是“开关”，而是语义提示——它不强制浏览器填或不填，只告诉浏览器“这个字段想表达什么”。控制记忆功能的关键，在于写对值、放对位置、配对类型，而不是简单设 off。
密码字段必须用标准语义值
给 type="password" 的输入框设 autocomplete="off" 基本无效。Chrome ≥76、Edge、Safari 都会主动忽略，甚至可能弹出“生成新密码”建议框。
- 登录页密码框：必须写
autocomplete="current-password" - 注册/改密页的新密码框：必须写
autocomplete="new-password" - 确认密码框也要写
autocomplete="new-password"，否则 Safari 可能把刚生成的密码重复填进两个框 - 写
user-password、pwd或大小写错（如Current-Password）等同于没写
普通字段要严格匹配 WHATWG 规范
浏览器只认官方定义的 token，拼写、连字符、大小写差一点，填充就完全失效。
- 姓名拆开写：
given-name+family-name，别用first-name或name - 邮箱必须是
autocomplete="email"，Email、user-email、mail全部被跳过 - 手机号用
tel，phone、mobile不识别 - 邮编用
postal-code，zip、pincode无响应 - 地址行要写
address-line1（注意是line1，不是line-1）
type 和 autocomplete 必须协同生效
单靠 autocomplete 不够，type 属性也得对上，尤其在 Safari 中，type 的语义强度直接影响是否触发建议。
-
type="email"+autocomplete="email"→ 键盘唤起邮箱模式，填充最稳 -
type="tel"+autocomplete="tel"→ 手机号识别准确率明显提升 -
type="date"+autocomplete="bday"→ 才能调出生日历史 -
type="number"+autocomplete="postal-code"→ Chrome 会禁用填充，应改用type="text"或type="tel" -
type="search"、type="hidden"、type="url"等不支持任何 autocomplete 值
动态渲染和框架里最容易踩坑
浏览器只在页面首次加载时扫描 DOM 建立映射，JS 后续插入或状态切换挂载的 input 很可能被跳过。
- React/Vue 中用
v-if或{show && <input>}动态渲染 → 字段挂载晚于浏览器初始化，填充失效 - 受控组件只写
value={state}却没配onChange→ 字段变只读，浏览器直接跳过 - SSR 页面中 autocomplete 必须由服务端直出，客户端 JS 补写无效
- input 必须包裹在
<form></form>标签内，纯 UI 组件里独立的 input 即使属性全对，也大概率不触发 - 同一表单中多个字段用了相同 autocomplete 值（如两个都写
tel）→ 浏览器随机选一个填，行为不可控
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
