autocomplete属性必须填标准值才有效，如street-address、address-level2（市）、address-level1（省）、postal-code、country；需在form内、用户聚焦且表单提交过一次才会触发。
autocomplete 属性值怎么填才有效
浏览器只认标准的 autocomplete 值，填错就等于没写。比如地址字段必须用语义化关键词，street-address 不能写成 address 或 street；城市必须用 address-level2（不是 city），邮编是 postal-code，国家是 country。
常见错误现象：输入框点了没反应、下拉不出现、只填了邮箱或姓名——大概率是 autocomplete 值不合法或没配全。
-
name属性可省，但autocomplete必须有且准确 - 中国用户要注意：
address-level1是省（如“广东省”），address-level2是市（如“深圳市”），不是区县 - 单行地址建议用
street-address；多行（如 address1 + address2）可分别用street-address和address-line2
为什么填了 autocomplete 还不触发自动填充
触发条件比想象中严格：必须是用户主动聚焦（点击/Tab）过该字段，且表单需提交过至少一次（浏览器才记录数据）；另外，Chrome 等浏览器只对 <form> 内的 <input> 生效，单独的 input 不会记。
使用场景上，如果页面用 JS 动态渲染表单（比如 Vue/React 组件 mount 后才插入 input），要确保 DOM 渲染完成后再让用户操作，否则浏览器可能来不及绑定自动填充逻辑。
立即学习“前端免费学习笔记（深入）”；
- 检查是否在
<form>标签内，且没有autocomplete="off"父级干扰 - 移动端 Safari 对
address-level2支持弱，有时需搭配name="city"提升兼容性 - Chrome 会忽略 type 不匹配的 input：邮编必须是
type="text"或type="tel"（type="number"会禁用自动填充）
中文地址自动填充的实际效果和局限
浏览器地址自动填充依赖用户本地保存的「联系人」或「付款信息」，而国内多数用户从未在 Chrome 设置里手动添加过完整中文地址——所以即使代码全对，也可能空白。
性能影响几乎没有，但兼容性差异大：Chrome 最稳定，Edge 次之，Firefox 基本不支持地址层级（只填姓名/邮箱），Safari 在 iOS 上仅支持部分字段（如 postal-code、country）。
- 不要指望它填出“XX省XX市XX区XX路XX号”，通常只到市+邮编+国家三级
- 若业务强依赖地址结构化，得配合高德/腾讯地图的 JS SDK 做搜索补全，
autocomplete只能当辅助 - 测试时务必用真实 Chrome 账户登录并保存过一条含省市邮编的地址，否则本地开发永远看不到效果
一个最小可用的 HTML 地址表单示例
下面这段代码在 Chrome 中保存过地址后，点击第一个输入框就能触发下拉：
<form> <input type="text" autocomplete="street-address" placeholder="街道地址"> <input type="text" autocomplete="address-level2" placeholder="城市"> <input type="text" autocomplete="address-level1" placeholder="省份"> <input type="text" autocomplete="postal-code" placeholder="邮编"> <input type="text" autocomplete="country" placeholder="国家"> </form>
注意：所有字段必须在同一 <form> 内；placeholder 不影响功能，但写清楚能减少用户误操作；iOS 上建议把邮编 type 改为 tel，键盘更友好。
真正卡住人的往往不是语法，而是浏览器没存过符合结构的数据，或者测试时用了隐身窗口——那肯定什么都不会出来。
