HTML的enterkeyhint设为done怎么改完成键-html教程-PHP中文网

enterkeyhint="done" 仅在移动设备软键盘生效，适用于 type="text" 等可编辑的和，不支持 button、contenteditable、disabled 或 readonly 元素；需全小写且值为规范枚举，但最终显示受 type 属性和输入法影响。

html的enterkeyhint设为done怎么改完成键

enterkeyhint="done" 在哪些输入场景下生效

这个属性只对 <input> 和 <textarea></textarea> 有效，且仅在移动设备软键盘上起作用。桌面浏览器基本忽略它，iOS Safari 和 Android Chrome（v71+）支持较好。如果你在桌面测试没反应，不是写错了，是环境不支持。

常见失效场景包括：type="button"、contenteditable 元素、被 disabled 或 readonly 的输入框——这些情况下 enterkeyhint 不会触发软键盘行为变更。

怎么写才能让软键盘显示「完成」键

直接加属性即可，不需要 JS 干预：

<input type="text" enterkeyhint="done"><textarea enterkeyhint="done"></textarea>

注意大小写必须全小写，"Done" 或 "DONE" 都无效。值必须是规范枚举之一：enter、done、go、next、previous、search、send。

html-deploy

使用 htmlcode.fun 将 HTML 内容或文件部署到网页，适用于用户要求“部署到网页”“托管此 HTML”“生成此前端...的实时链接”等场景。

下载

enterkeyhint="done" 在多数 Android 键盘上显示为「完成」或「✓」图标；iOS 上通常显示为「完成」文字（取决于系统语言）
如果输入框绑定了 onsubmit 或监听了 keydown 事件，enterkeyhint 不影响逻辑，只是 UI 提示——按下去仍会触发默认表单提交或换行（<textarea></textarea>），需自行 event.preventDefault()

为什么设了但键盘还是显示「搜索」或「换行」

优先级问题：软键盘最终显示什么，由多个因素共同决定，enterkeyhint 只是建议，不是强制指令。以下情况会覆盖它：

type="search" 时，浏览器会无视 enterkeyhint，强制显示「搜索」
<textarea></textarea> 默认允许换行，即使设了 enterkeyhint="done"，部分键盘（尤其旧版 Android）仍显示「换行」——这时得配合 event.key === "Enter" + preventDefault() 拦截
某些 WebView（如微信内置浏览器、老版本 UC）根本不支持该属性，查 MDN 兼容性表确认运行环境

配合 JS 实现真正的「完成」行为

光改提示词不够，用户按「完成」键后往往需要收起键盘并提交/跳转。典型做法是监听 keydown 并拦截 Enter：

input.addEventListener("keydown", (e) => {
  if (e.key === "Enter" && e.target.getAttribute("enterkeyhint") === "done") {
    e.preventDefault();
    // 执行你的完成逻辑，比如 blur() 收起键盘、调用 submit()
    e.target.blur();
  }
});

注意：e.key 在部分安卓键盘上可能返回 "Enter"，也可能返回 "Unidentified"（尤其第三方输入法），更稳妥的判断方式是监听 input 后检查是否符合完成条件，或直接绑定 blur 事件做后续处理。

真正麻烦的不是设属性，而是不同输入法对 enterkeyhint 的响应程度差异很大——有些只改图标不改行为，有些完全无视。上线前务必在真机（特别是华为、小米、iPhone）上逐个验证。