form autocomplete="off"经常失效，因为它不是全局开关，仅作为未显式设置autocomplete的子input默认值；chrome 76+等现代浏览器会主动忽略它，尤其对password或email字段，真正起作用的是各input的语义化autocomplete值。
form autocomplete="off" 为什么经常失效
它根本不是“全局开关”，只是给没显式设 autocomplete 的子 <input> 提供一个默认值，而现代浏览器（Chrome 76+、Edge 90+、Firefox 90+）基本忽略它。尤其当表单里有 type="password" 或 type="email" 字段时，Chrome 会主动绕过 form autocomplete="off"，强行尝试填充。
- 只对未写
autocomplete的子字段生效；一旦某个<input autocomplete="email">存在，整个表单级设置就被覆盖 - 即使
<form autocomplete="off"></form>，只要存在<input type="password" autocomplete="current-password">，密码照样被填 - 新版 Edge 把它当作“建议”而非指令，HTTPS 页面中几乎不执行
真正起作用的是每个 input 的 autocomplete 值
autocomplete 必须写在 <input>、<textarea></textarea> 或 <select></select> 上，且必须用 WHATWG 规范定义的语义化 token，比如 email、current-password、given-name，拼错、大小写错、加连字符（如 auto-complete）或自定义值（如 myemail）都会被浏览器直接忽略。
-
name是无效值，应拆成given-name和family-name -
tel可识别，phone或telephone不被支持 -
street-address有效，address或shipping-address无效 - 密码字段必须区分场景：
current-password（登录）、new-password（注册/改密），二者不能混用
React/Vue 动态表单中 autocomplete 容易踩的坑
框架里靠状态控制渲染时，浏览器可能沿用旧缓存逻辑，导致填错字段或建议错位。关键不在“有没有写”，而在“是否在 DOM 初始挂载时就存在且语义一致”。
- 用
v-if或{show && <input>}动态插入，浏览器已错过发现时机，自动填充失效 - 从登录页切到重置密码页，密码框的
autocomplete必须从current-password切换为new-password，否则 Chrome 可能把旧密码塞进新密码框 - 受控组件中若只写
value={state}却没配onChange，字段变只读，浏览器跳过填充；想保留自动填充，改用defaultValue - SSR 输出的 HTML 必须包含完整
autocomplete属性，客户端 JS 补充无效
密码字段必须绕开 form 级控制
登录页如果只依赖 <form autocomplete="off"></form>，而没给密码框显式写 autocomplete="current-password"，Chrome 很可能填错——比如把上一个注册页存的 new-password 塞进来。注册页的“新密码”和“确认密码”两个框都必须设 autocomplete="new-password"，否则行为不可控。
-
autocomplete="off"对密码字段本身几乎无效；new-password才是现代浏览器唯一广泛支持的“禁用已有密码填充”语义 - 字段
type和autocomplete必须匹配：例如type="email"+autocomplete="email"，否则 Chrome 可能降级处理 - 同一页面多个字段共用相同
autocomplete值（如两个都写tel），浏览器随机选一个填，行为不可预测
真正可控的粒度只在单个控件上，form 层的 autocomplete 已退化为文档注释级别——它存在，但别指望它起作用。最易被忽略的一点是：字段必须在页面首次加载时就存在于 DOM 中、可见、可聚焦，且包裹在带 action 的 <form></form> 内，否则浏览器根本不启动自动填充流程。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
