用户单击“开始”时隐藏移动 Web 浏览器键盘答案

【问题标题】：Hide mobile web browser keyboard when user clicks "Go"用户单击“开始”时隐藏移动 Web 浏览器键盘
【发布时间】：2018-02-05 20:29:04
【问题描述】：

我建立了一个网站，其中包含几个 type="number" 的输入框。一些 jQuery 会检测这些框中的值何时发生变化，执行计算并向用户显示结果。没有表单提交。甚至没有表格，只有输入框。

这在桌面上效果很好。

但是，在移动设备上存在问题。在 Android 上的 Chrome 上，当用户点击输入框时，会弹出移动键盘。没关系。键盘包括一个“开始”按钮。目前 Go 按钮什么都不做，当用户点击 Go 时键盘仍然存在。我希望 Go 按钮简单地隐藏移动键盘。

关于如何做到这一点的任何想法？

【问题讨论】：

标签： android jquery html forms mobile

【解决方案1】：

移动键盘上的“Go”按钮向输入框发送“Enter”键。要使键盘消失，请在用户单击 Enter 时模糊输入字段上的焦点。这一点 jQuery 完成了这项工作：

$("#inputElementId").on("keypress", function(event){
    if (event.keyCode == 13) {
            event.preventDefault();
            event.target.blur()
        }
})

【讨论】：

更好地使用 keyup，因为 keypress 已被弃用

【解决方案2】：

如果您不希望他们能够点击输入框，为什么不将其设为只读？

 <input type="text" readonly>

或查看有关移动键盘的其他帖子，因为它可能是您正在寻找的更多内容：HTML Mobile -forcing the soft keyboard to hide

【讨论】：