必须用标准<input type="text">并置于<form>内，配合autocomplete="given-name"和family-name"比单用name更可靠；需初始DOM存在、用户已保存资料且浏览器启用自动填充。
在 H5 表单中使用 autocomplete="name" 可以帮助浏览器识别“姓名”字段，从而触发自动填充（Autofill）功能，但要让浏览器真正填入用户真实姓名，**光写 autocomplete="name" 不够，还需配合语义化结构和浏览器支持规则**。
必须用标准的 <input> 元素，且类型为 text
浏览器只对符合规范的输入控件响应 autocomplete 属性。以下写法有效：
<input type="text" name="full_name" autocomplete="name">以下写法无效或被忽略：
-
<input type="hidden">、<div contenteditable>等非表单控件 -
type="string"或自定义 type（如type="fullname"）——必须是合法 HTML5 type，推荐text - 未包含在
<form>内（部分浏览器要求表单上下文）
推荐拆分为 given-name 和 family-name 更可靠
现代浏览器（Chrome、Edge、Safari）对细分姓名字段的支持更好，比单用 name 更容易命中用户保存的资料：
<input type="text" name="family_name" autocomplete="family-name">
如果只要一个姓名框，可继续用 autocomplete="name"，但需注意：
- Chrome 通常会填入「完整姓名」（First + Last 合并，空格分隔）
- Safari 在 iOS 上更倾向匹配
name，但若用户只存了「姓」或「名」，可能不触发 - 避免混用：不要在一个页面同时出现
name和given-name，易导致填充错乱
确保表单有明确的提交行为与上下文
浏览器需要判断这是「注册/登录/收货信息」类表单，才会启用姓名填充。关键点：
- 表单应有
<form>标签，并具备method和action（即使为#或空） - 建议搭配其他常见字段，如
autocomplete="email"、autocomplete="tel"，增强语义识别 - 避免用 JS 动态生成 input 后再加 autocomplete —— 需在 DOM 初始渲染时就存在该属性
- 用户需已在浏览器设置中启用了自动填充，并已手动保存过含姓名的联系人或付款资料
验证是否生效的小技巧
开发调试时可快速确认：
- Chrome：右键输入框 → “检查” → 查看
autocomplete是否正确渲染 - 聚焦该输入框，看地址栏右侧是否出现「钥匙图标」→ 点击可查看当前可填充的资料项
- 在隐身窗口测试（排除插件干扰），并确保已添加一条含「Name」字段的自动填充条目（设置 → 自动填充 → 地址和更多 → 添加新地址）
