Javascript Android Chrome在键盘输入不工作后单击

很难用一个简短的标题来描述这个问题，但复制这个问题非常简单：

代码示例

Android Chrome：
-单击输入字段以打开虚拟键盘
-使用所述键盘键入字符
-向下滚动
-点击按钮
单击未注册：(
按钮被选中，键盘刚好关闭
点击

在Codepen上试用：

描述 因此，单击一个输入字段，触发Android显示屏幕键盘。然后输入一个字符，任何字符，这是（尽管奇怪）必须的

现在保持键盘打开/可见并滚动（向下）至屏幕上在输入字段中输入字符时不在可见区域的区域。单击任何可单击的内容（

，

，

等）

预期行为： 已注册单击

实际行为： 未注册任何单击

---

我正在做一个自动完成/提前键入/搜索下拉列表，其中要单击的元素是动态添加的。因此，起初我认为这个问题的本质是动态添加的内容或

位置：绝对；

元素，但这个示例显示它比我应用的场景简单得多

我所尝试的：

• 使用
  ，
  ，

• 在

  文档

  上注册事件侦听器，以确定所述点击的目标。该目标是键盘输入过程中出现在可见区域的底层元素（例如：
  ）

帮助 这个场景非常简单（可能很常见），很多人都会遇到这个问题。但是，我找不到解决方案或解决方法

---

我希望能够注册键盘输入过程中可见区域之外的第一次单击，例如本例中的按钮单击。是否有方法确保输入后的第一次单击被拾取，使用JavaScript或CSS或任何东西？

问题似乎位于输入元素的焦点。模糊element修复了未注册单击的行为

添加以下JavaScript（在本例中）将解决此问题：

在将文本输入到输入元素后直接执行的单击，其目标在输入期间在视口中可见。向下滚动并单击输入期间不可见的元素，将生成一个

事件。目标
，例如
——输入期间在单击坐标处可见的第一个元素.
因此，我怀疑这个问题是优化的产物（在输入过程中忽略屏幕外的元素）。
你在寻找什么？不明白！@UnknownName很好，我会更新我的帖子！我希望你在客户端键入时需要验证输入字段……我说得对吗？javascript允许你验证表单[验证：必须输入数字/字母/大写或小写字母/符号/电子邮件等]@UnknownName此问题与验证无关
document.querySelector('input').addEventListener('input', (e) => {
    e.target.blur();
    e.target.focus();
});