HTML5 autocomplete不支持“shipping address-line1”等复合值，正确做法是在form上设autocomplete="shipping"，子字段用标准值如address-line1、address-level2、postal-code等。
HTML5 的 autocomplete 属性本身不支持 "shipping address-line1" 这样的值。这是常见误解——浏览器规范中没有定义以 shipping 为前缀的地址字段类型（如 shipping address-line1），直接写这个值会被忽略，等同于 autocomplete="off" 或无效值，无法触发自动填充。
正确使用 autocomplete 填写收货地址
要让浏览器识别并自动填充收货地址（而非默认的账单地址），关键在于：
- 使用标准的
autocomplete值（如"address-line1"、"address-level2"等） - 通过
form元素的autocomplete="shipping"统一声明整组字段用途 - 确保字段顺序合理、语义清晰，且与浏览器期望的地址结构匹配
推荐配置方式：在 form 上设置 shipping 上下文
将 autocomplete="shipping" 写在 <form> 标签上，再为各输入框使用标准地址字段名：
<input type="text" name="shipping_line1" autocomplete="address-line1" placeholder="街道地址">
<input type="text" name="shipping_line2" autocomplete="address-line2" placeholder="公寓/楼层">
<input type="text" name="shipping_city" autocomplete="address-level2" placeholder="城市">
<input type="text" name="shipping_region" autocomplete="address-level1" placeholder="省/州">
<input type="text" name="shipping_postal" autocomplete="postal-code" placeholder="邮编">
<input type="text" name="shipping_country" autocomplete="country" placeholder="国家">
</form>
各字段 autocomplete 值对照说明
以下是最常用且被主流浏览器（Chrome、Edge、Safari）广泛支持的地址字段值：
立即学习“前端免费学习笔记（深入）”；
-
address-line1：主街道地址（如“中山路123号”） -
address-line2：补充信息（如“A座1001室”） -
address-level2：城市（city） -
address-level1：省、州、自治区（region） -
postal-code：邮政编码 -
country：国家（建议用<select>并设autocomplete="country"，值为 ISO 3166-1 alpha-2 代码如"CN"）
注意事项与增强体验技巧
即使配置正确，自动填充效果也受多种因素影响：
- 浏览器需已保存过有效的收货地址（用户需在设置中启用“自动填充地址”并添加 shipping 地址）
- 避免混用
autocomplete="billing"和shipping在同一表单，易导致冲突 - 不要给
name或id赋予误导性值（如name="billing_address"），保持语义一致 - 移动端 Safari 对
autocomplete支持较弱，可配合inputmode="text"或enterkeyhint="next"提升体验
