enterkeyhint合法值仅七个严格小写的字符串：enter、done、go、next、previous、search、send；其中只有"search"能稳定触发搜索图标，且需搭配type="search"才在ios/android主流浏览器中可靠生效。
enterkeyhint 支持哪些值，哪些能触发搜索图标
enterkeyhint 是 HTML <input> 和 <textarea></textarea> 的原生属性，用于提示浏览器软键盘显示哪个语义化的“回车键”图标。它不改变行为，只影响 UI 提示。要让键盘显示「搜索」图标，必须设为 "search" —— 这是唯一被所有主流浏览器（Chrome、Safari、Edge）识别并渲染为放大镜图标的值。
其他常见值如 "enter"、"done"、"go"、"next" 等，各自对应不同图标，但只有 "search" 明确映射到搜索语义。iOS Safari 对 "search" 支持稳定；Android Chrome 从 v71+ 开始支持，旧版本会退化为默认回车键。
怎么写才真正生效：HTML 属性 + 行为绑定缺一不可
光写 enterkeyhint="search" 不够。软键盘显示搜索图标后，用户按该键仍会触发 keydown 或 submit 事件，默认行为仍是换行或表单提交。你得主动拦截并执行搜索逻辑：
- 对
<input type="search">或普通<input>，建议包裹在<form></form>中，并监听submit事件（最可靠，兼容性好） - 避免只监听
keydown并判断event.key === "Enter"，因为enterkeyhint="search"不改变event.key值，它仍是"Enter" - 务必调用
event.preventDefault()在submit处理函数中，否则页面可能刷新或跳转
示例：
为什么有时键盘还是显示回车，不是搜索图标
常见失效原因不是代码写错，而是上下文不满足软键盘的语义推断：
-
type属性干扰：如果<input type="text">同时有enterkeyhint="search"，多数浏览器会尊重；但若设成type="number"或type="email"，即使加了enterkeyhint="search"，iOS 和部分 Android 键盘仍强制显示数字/邮箱专用键，忽略 hint - 父容器或 CSS 干预：某些 UI 框架（如 Ionic、React Native WebView）会接管输入框渲染，绕过原生
enterkeyhint；或通过contenteditable模拟输入，此时该属性完全无效 - 未聚焦或动态设置：属性需在元素插入 DOM 且获得焦点前已存在；用 JS 动态设置
element.enterKeyHint = "search"在 Safari 中不生效（仅支持 HTML 属性写法）
替代方案：当 enterkeyhint 不可用时怎么办
如果目标环境明确不支持（如老旧 WebView、微信内置浏览器），不要强行 hack enterkeyhint。更务实的做法是：
- 用
<input type="search">替代type="text"—— 它自带语义，部分浏览器即使没enterkeyhint也会倾向显示搜索键 - 在输入框右侧固定一个
<button type="submit">?</button>，视觉和操作上补全搜索意图，也解决键盘不可靠问题 - 对纯移动端 H5，可结合
inputmode="search"（提示键盘启用搜索优化布局，如无数字行），它和enterkeyhint可共存，但作用不同：一个管键盘类型，一个管回车键图标
软键盘图标的最终呈现，是浏览器、OS、输入法三方协商的结果；enterkeyhint="search" 是向它们发出的明确请求，不是强制指令。别在 iOS 15 以下或定制 ROM 上较真图标一致性，优先保证 submit 事件能捕获到用户意图。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
