先记住这个答案
autocomplete 属性的值不是简单的 on 或 off，而是由一组标准 token 拼成的字符串，用空格分隔。比如 autocomplete="shipping street-address" 告诉浏览器这个输入框要填收货地址的街道信息。浏览器会根据 token 从已保存的地址、联系方式或银行卡信息里找到匹配项，提示用户一键填入。
autocomplete的 token 用空格分隔shipping与billing区分地址组- 卡号用
cc-number，到期用cc-exp - 写错 token 名浏览器不会报错，只是静默不填
地址表单的 token 怎么写
一个电商结账页通常有收货地址和账单地址两组字段。如果两组都写 autocomplete="street-address"，浏览器分不清该填哪个。这时用 shipping 和 billing 前缀来区分。
<!-- 收货地址：shipping 前缀 -->
<input name="ship-street" autocomplete="shipping street-address" />
<input name="ship-city" autocomplete="shipping address-level2" />
<input name="ship-province" autocomplete="shipping address-level1" />
<input name="ship-zip" autocomplete="shipping postal-code" />
<!-- 账单地址：billing 前缀 -->
<input name="bill-street" autocomplete="billing street-address" />
<input name="bill-city" autocomplete="billing address-level2" />address-level1 对应省或州，address-level2 对应市或城市。这些名字是 HTML 标准定义的，不能自己编。name 属性可以随便取，浏览器靠的是 autocomplete token 来识别字段含义。
银行卡字段的 token
支付表单的卡号、姓名、有效期各有专门的 token。浏览器在用户同意后才会填入，通常还会要求系统级验证（指纹、面容或密码）。
<input name="cardname" autocomplete="cc-name" />
<input name="cardnumber" autocomplete="cc-number" inputmode="numeric" />
<input name="expiry" autocomplete="cc-exp" />
<input name="cvc" autocomplete="cc-csc" />cc-exp 是到期日，格式是 MM/YY 或 MM/YYYY，具体取决于浏览器。如果想分开月份和年份，可以用 cc-exp-month 和 cc-exp-year。cc-csc 是卡背面的安全码，浏览器一般不会保存这个值。
容易答错的地方
- 以为
autocomplete="on"就够了 on只是告诉浏览器「你可以自动填充」，但浏览器得自己猜这个字段是什么。猜错了就会把邮箱填进地址栏。写明确的 token 比如email、tel、street-address，浏览器才能精准匹配。- token 拼写错了不会报错
- 把
street-address写成streetAddress或address，浏览器不会抛异常，只是当作不认识的值，跳过这个字段不填。开发时不容易发现，上线后用户抱怨「自动填充不好使」才知道。
面试官还会怎么问？
autocomplete="off" 真的能阻止浏览器填充吗？
很多浏览器或密码管理器仍会在登录表单提供账号密码填充，不能把 off 当成强制禁令。一次性验证码应使用标准 token autocomplete="one-time-code"，它告诉浏览器这里期待验证码，支持的浏览器甚至可以从符合格式的短信中提取并填入；它不是“阻止自动填充”的非标准技巧。
name 属性和 autocomplete 都能影响自动填充，优先级是什么？
规范中的 autocomplete token 明确表达字段用途，浏览器也可能结合 name、id 等信息及自身策略判断。不能把各浏览器的填充算法概括成一条固定优先级；能确定字段含义时，显式写正确的 token 更可靠。
同一页面有多个表单，token 会冲突吗？
不能只靠 <form> 边界假定浏览器一定把同名字段分开。同一组 token 可能被当成相同的填充用途；收货与账单地址用 shipping、billing 区分，同一页面若还有两套同类型地址，可在最前面加不同的 section-* token 给它们命名。
参考资料
示例用于理解所注明的运行环境与边界；延伸学习可结合原文中的更多案例。