autocomplete="new-password"的作用是阻止浏览器自动填充旧密码并为新密码保存提供语义支持，需与current-password字段共存、type="password"、位于有效form内且无value值才能生效。
autocomplete="new-password" 不是用来“提示浏览器保存新密码”的，它的作用恰恰相反：告诉浏览器不要自动填充已保存的旧密码，并为后续手动输入的新密码提供保存机会。真正触发“是否保存新密码”提示的，是用户成功提交表单这一行为，而非该属性本身。
必须满足的三个基础条件
仅写 autocomplete="new-password" 不会生效，浏览器需同时识别出这是一个“密码变更流程”：
-
字段类型必须是
type="password"—— type="text" 或其他类型下该属性被完全忽略； -
必须位于语义化
标签内，且最好有method="POST"和明确的action（如/change-password）； -
不能预设
value属性（包括空字符串value=""），否则 Chrome 会跳过识别，甚至误判为已有内容而尝试填充。
需要配对 current-password 字段
现代浏览器（Chrome 115+、Edge 105+）要求上下文明确区分“旧密码验证”和“新密码设置”。单独一个 new-password 字段大概率被忽略：
- 在修改密码页中，应同时存在两个密码字段：
- 两字段顺序不限，但需共存于同一表单；
- 确认密码框也建议设为
autocomplete="new-password"，避免管理器只填第一个而遗漏第二个。
name 和 id 命名要避开干扰词
浏览器会结合 name/id 的语义辅助判断字段用途，以下命名易导致误判：
- 避免使用
name="password"、name="pass"—— 可能被当作通用密码字段，与current-password混淆； - 避免含
old、current、confirm等词（如name="confirm_password"），除非它确实对应确认逻辑且已正确标注 autocomplete； - 推荐使用中性、可读的名称，例如
name="new_password"、name="account_password"。
不推荐但可作为兜底的补充手段
若仍遇到兼容问题（如旧版 WebView 或 Safari），可在保持语义正确的前提下叠加轻量策略：
- 在真实密码框前插入一个隐藏干扰项：
； - 服务端渲染（SSR）页面注意 hydration 过程中不要清空或覆盖
autocomplete属性； - 可同时写
autocomplete="new-password" autocomplete="off"（无冲突），为极少数环境提供降级支持。
记住：浏览器是否弹出“保存密码”提示，取决于表单是否成功提交、且响应状态码为 2xx（如 200/204），以及整个流程是否被识别为可信的密码变更操作。autocomplete="new-password" 是这个流程中不可或缺的语义锚点，不是开关，也不是捷径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
