autocomplete 更关键，浏览器主要依据 WHATWG 规范的 autocomplete 值匹配字段语义；name 属性仅作 fallback，且需有意义，但单独设置 name 无法可靠触发填充。
浏览器自动填充不触发，name 和 autocomplete 哪个更关键？
浏览器自动填充不是靠猜，而是按规范匹配字段语义。只设 name="email" 不够，必须配 autocomplete="email"；反之，只写 autocomplete 但 name 是乱码（比如 name="user_mail_field"），部分浏览器（尤其是 Safari）会直接放弃填充。Chrome 对 name 宽松些，Safari 和 Firefox 更依赖 autocomplete 的标准值。
-
autocomplete值必须是WHATWG 规范定义的合法值，如"given-name"、"family-name"、"organization"，不能自创（"firstname"无效） -
name属性仍需有意义，某些密码管理器（如 1Password）会 fallback 到name匹配 - 避免给输入框加
autocomplete="off"—— 这个值已被现代浏览器忽略或弱化处理，真正禁用要用autocomplete="new-password"（仅限密码字段）
type="password" 字段反复被自动填充，怎么安全绕过？
密码字段被错误填充（比如用邮箱填进密码框）通常是因为它和前面的用户名/邮箱字段离得太近、且没明确隔离语义。浏览器看到连续两个文本类字段，容易“顺手”把已存凭据塞进去。
- 密码字段必须单独声明
autocomplete="new-password"，这是唯一被广泛支持的“请别填这里”的信号 - 不要写
autocomplete="off"或留空 —— Chrome 117+ 会无视，Safari 可能当"on"处理 - 如果页面有“注册+登录”混合表单，确保密码字段 DOM 位置不紧贴在邮箱/用户名之后；中间插入一个
type="hidden"或视觉分隔元素有助于打断自动填充链
地址、电话、银行卡等复杂字段如何让浏览器识别？
浏览器对 autocomplete 的支持程度差异很大：邮箱、姓名、密码基本全平台可用；但 "street-address"、"tel"、"cc-number" 在 Safari 上支持较好，Firefox 较弱，Chrome 需要字段结构足够清晰。
- 地址建议拆成标准子字段，而不是一个大
textarea：<input type="text" name="addr1" autocomplete="address-line1"> <input type="text" name="addr2" autocomplete="address-line2"> <input type="text" name="city" autocomplete="address-level2">
- 银行卡号用
autocomplete="cc-number"，有效期用autocomplete="cc-exp"，CVV 用autocomplete="cc-csc"—— 这些在 Chrome 和 Safari 中可触发密码管理器的卡片填充 -
tel类型 +autocomplete="tel"才可能唤起系统键盘的电话布局，纯type="text"即使写了autocomplete也大概率失效
表单提交后自动填充消失，刷新也不恢复？
这往往不是代码问题，而是浏览器行为策略：自动填充数据只在用户主动交互后（如点击输入框、聚焦、开始输入）才注入；如果 JS 动态清空了字段、或用 form.reset() 重置，填充状态就被丢弃，且不会自动回填。
立即学习“前端免费学习笔记（深入）”；
- 不要用
input.value = ""或el.innerHTML = ""清空关键字段，改用el.removeAttribute("value")并确保autocomplete未被移除 - 表单提交后若需保留填充状态，避免整页刷新；用
event.preventDefault()+ fetch 提交，成功后再手动恢复字段初始值（而非重置） - 某些框架（如 React）中受控组件未同步
defaultValue或value，会导致浏览器认为字段“从未被填过”，从而拒绝后续填充
自动填充不是开关，是浏览器根据字段语义、DOM 结构、用户历史三者共同推断的结果。写对 autocomplete 是起点，但稍一改动顺序、加个隐藏字段、或用 JS 覆盖了原生行为，就可能全盘失效。
