在iphone safari webapp中隐藏键盘

Question

我正在为iPhone创建一个基于HTML/CSS/JS的webapp.我正在使用表单来接收输入并将数据传递给脚本,但我遇到的一个问题是键盘不会消失.用户将输入信息,点击提交,因为它是JavaScript,页面不会重新加载.键盘仍然存在,这是一个麻烦,并为用户增加了另一个步骤(必须关闭它).

有没有办法强迫Safari中的键盘消失？从本质上讲,我有一种感觉,这个问题等同于问我如何强制输入框失去焦点或模糊.在线查看,我发现有很多示例可以检测模糊事件,但没有一个可以强制发生此事件.

Answer 1

更简单地说,您可以在当前聚焦的元素上调用blur().$( "#inputWithFocus").模糊()

Answer 2

document.activeElement.blur();

Answer 3

您可以尝试focus()使用非文本元素,例如提交按钮.

Answer 4

这是一个小代码片段,只要焦点在输入或textarea字段中并且用户点击该元素之外(桌面浏览器中的正常行为),它就会始终隐藏键盘.

function isTextInput(node) {
    return ['INPUT', 'TEXTAREA'].indexOf(node.nodeName) !== -1;
}

document.addEventListener('touchstart', function(e) {
    if (!isTextInput(e.target) && isTextInput(document.activeElement)) {
        document.activeElement.blur();
    }
}, false);