datalist 在 IE 全版本中完全不支持，Safari 15.3 及更早版本仅支持键盘方向键选择、不响应鼠标点击，部分旧版 Android WebView 存在建议不弹出或 option 值失效问题；需通过 JS 检测并降级为 select，同步值与事件，注意语义一致性。
datalist 在 IE 全版本中完全不支持，Safari 15.3 及更早版本仅支持键盘方向键选择、不响应鼠标点击，部分旧版 Android WebView 也存在建议不弹出或 option 值失效的问题。
IE 完全无 fallback，必须主动降级
IE 不识别 datalist 标签，会将其当作未知元素忽略，既不渲染也不触发任何行为。它不会自动退化为 select，也不会报错——只是静默失效。
- 不能依赖 CSS 隐藏/显示切换，因为 IE 根本不解析
datalist内容 - 降级逻辑必须在 JS 中判断：
if (!('list' in document.createElement('input')))是最轻量的检测方式 - 降级后需手动把
option的value搬到select中，并同步绑定原input的值和事件 - 注意：IE 下
select的change事件触发时机与现代浏览器不同，需用click或focusout补充监听
Safari 15.4 之前鼠标不可点，但建议仍可键盘操作
Safari ≤15.3 会渲染下拉建议框，但点击选项无反应，用户只能用 ↑/↓ + Enter 选中——这对触屏设备或不熟悉键盘操作的用户极不友好。
- 检测方式可用
navigator.userAgent.includes('Safari') && !navigator.userAgent.includes('Chrome')，再结合版本号正则提取 - 不必全量降级，可只对 Safari ≤15.3 启用
select替代方案 - 若保留
datalist，需额外加一段 JS：监听input的keydown，拦截Enter并手动设置值，避免用户输完按回车却没提交成功 - 别忘了移除原
input的list属性，否则 Safari 仍会尝试加载空建议框
Android WebView 兼容性碎片化，建议统一检测后处理
很多 Android 系统自带 WebView（尤其 7.0–9.0）对 datalist 支持不稳定：有的不弹建议，有的弹出但 option 值为空，有的甚至导致页面重绘异常。
- 推荐使用
Modernizr.input.list（需引入 Modernizr）或手写检测函数：const hasDatalist = 'list' in document.createElement('input') && !!document.createElement('datalist').options - 降级时不要直接替换 DOM，而是用 JS 动态插入
select并隐藏原input，保持表单结构一致 - 如果业务允许，可对移动端 UA（含 WebView）默认启用
select方案，PC 端再走datalist，比运行时检测更稳定 - 务必测试真机，模拟器常无法复现 WebView 的真实行为
真正麻烦的不是“要不要降级”，而是降级后如何让 select 的交互语义和原 input 保持一致：比如用户本可输入任意值，但 select 强制选值；或者提交时后端期望的是自由文本而非选项 ID。这些语义断层，得靠 JS 显式桥接，不能只换标签了事。
