Javascript 表单提交后未隐藏Android键盘

您使用输入字段和“清除”按钮创建表单，并期望：

• 当您键入内容并点击移动键盘上的“Go/Search”按钮时，键盘应该是隐藏的
• 当你点击“清除”按钮时，输入应该被清除，但键盘保持打开状态

有趣的是，它的工作原理是完全相反的：提交表单后键盘会打开，清理输入后键盘会消失

有没有办法让它“正确”呢

代码是HTML

<form id="form">
  <input id="input" type="search" autofocus />
</form>
<button id="clear">clear</button>

---

演示

我知道您是如何看待它的，但问题在于某些事件在JS中默认如何工作

当你点击“清除”按钮时，你所做的就是将注意力从输入中移开，这反过来又会使键盘消失。因为你不再在你的输入上打字，键盘就消失了

但是，当您单击“Go/continue/submit”按钮时，焦点仍在输入上，直到相应的表单动作触发

我想：

提交时在输入上强制focusout事件，单击“清除”后在输入上聚焦，与您现在所做的相同；或

添加提交按钮以触发表单提交事件。这将从输入中移除焦点，并将其放在提交按钮上

下面是选项1的代码片段：

document.getElementById（'form'））
.onsubmit=函数（e）{e.preventDefault（）；}
document.getElementById（“表单”）.onsubmit=函数（e）{
e、 预防默认值（）；
document.getElementById（'input'）.blur（）；
};
document.getElementById（'clear'）.onclick=function（e）{
e、 预防默认值（）；
var input=document.getElementById（'input'）；
input.value=''；
input.focus（）；
};

清除
document.getElementById('form')
  .onsubmit = function(e) { e.preventDefault() }

document.getElementById('clear')
  .onclick = function(e) {
    e.preventDefault()
    var input = document.getElementById('input')
    input.value = ''
    // trying to focus to open keyboard, but it didn't work
    input.focus()
  }