list属性必须搭配同id的datelist元素才能生效，且input类型限于text等文本类，autocomplete="off"会禁用该功能，iOS Safari不支持下拉显示。
list 属性必须搭配 datelist 元素才能生效
单独给 input 加 list 属性不会显示任何下拉选项，浏览器根本不会渲染候选列表。关键在于：必须存在一个 id 与 list 值完全匹配的 datelist 元素，且该元素需包含至少一个 option 子元素。
常见错误是只写 <input list="cities">，却漏掉 <datelist id="cities"></datelist>，或者把 id 拼错（比如写成 city-list 而 list 属性值是 cities），此时控制台无报错，但功能静默失效。
-
list的值是纯 ID 字符串，不带#前缀（区别于 CSS 选择器） -
datelist必须在 HTML 文档中（不能用 JS 动态插入后才绑定，部分浏览器不支持延迟绑定） -
option不需要value属性也能显示，但用户选中时会以textContent作为输入值
autocomplete="off" 会禁用 list 下拉菜单
如果同时设置了 autocomplete="off"，多数现代浏览器（Chrome、Edge、Firefox）会直接忽略 list 行为——哪怕 datelist 存在且结构正确，也不会弹出选项面板。
这不是 bug，而是规范行为：autocomplete 控制的是浏览器自动填充逻辑，而 list 提供的是原生建议机制，二者冲突时后者被压制。
立即学习“前端免费学习笔记（深入）”；
- 要启用
list，必须移除autocomplete属性，或显式设为autocomplete="on" - 若业务真需禁用自动填充（如防密码管理器干扰），可改用 JS 实现自定义下拉，而非依赖原生
list - 某些旧版 Safari 对
autocomplete处理更宽松，但不应依赖这种兼容性
input type 必须是 text、search、url、tel、email 或 number
list 属性对 type="checkbox"、type="radio"、type="file" 等无效，浏览器会忽略它。只有文本类输入控件才支持候选建议。
特别注意：type="number" 虽然接受 list，但用户只能手动输入数字，下拉项仅作提示——选中非数字文本（如 "unknown"）会导致输入框值变为空字符串，因为类型校验失败。
-
type="text"是最稳妥的选择，兼容所有option内容 -
type="search"和type="text"行为一致，仅语义和默认样式略有差异 - 不要试图用
list替代select：它不提供必选约束、不支持分组（optgroup）、无法用键盘方向键高亮选项
移动端 Safari 对 list 支持有限且无视觉反馈
iOS Safari（截至 iOS 17）虽解析 list 属性，但不会显示下拉面板，仅在键盘上方提供快捷词建议（如果系统词典中有匹配项）。这意味着用户无法看到你定义的 option 列表，功能形同虚设。
这不是配置问题，是 WebKit 的实现限制。Android Chrome 和桌面端浏览器则正常显示下拉候选框。
- 若目标用户含大量 iOS 用户，需用 JS +
contenteditable或第三方库（如 Select2）模拟类似体验 - 可通过
if ('list' in document.createElement('input'))检测原生支持，但 iOS Safari 返回true，实际不可用——更可靠的方式是 UA 检测或运行时试探 - 别指望
list在移动端做到跨平台一致，它的设计初衷就是桌面端辅助输入
list 是轻量方案，但依赖浏览器实现细节多、移动端不可靠、交互能力弱。真正需要可控下拉体验时，绕过它反而是更省心的做法。 
