Android WebView点击<label for="...">首次聚焦输入框但无法唤起软键盘(IME)的问题求助

兄弟，这个坑我之前用Capacitor做混合Android应用的时候实打实踩过！这确实是Android WebView的一个已知行为，不是你代码写错了——WebView对于<label for>触发的首次focus事件，有时候不会正确识别为“用户主动需要输入”的操作，所以虽然输入框获得了焦点，但系统没唤起软键盘；第二次点击时因为输入框已经有过聚焦状态了，WebView的事件逻辑就正常响应了，直接点<input>是原生交互路径，所以从一开始就没问题。

给你几个亲测有效的解决办法，按需选：

• 方案一：修改HTML结构（最简洁无代码侵入）
  把<input>直接嵌套到<label>里面，不用for属性，这种结构的表单交互在WebView里会被识别为原生级别的用户操作，首次点击就能正常唤起键盘：

  <label>
    用户名：
    <input type="text" id="username">
  </label>
  

• 方案二：前端JS手动干预点击事件
  如果没法改HTML结构，就给所有带for属性的<label>加个点击监听，手动触发输入框的focus并强制唤起键盘，用setTimeout避开WebView的事件队列延迟，再设置选区模拟用户输入操作：

  document.querySelectorAll('label[for]').forEach(label => {
    label.addEventListener('click', (e) => {
      const targetInput = document.getElementById(label.getAttribute('for'));
      if (!targetInput) return;
  
      // 先触发一次focus，确保元素获得焦点
      targetInput.focus();
      // 延迟执行二次focus和选区设置，让WebView有时间处理事件
      setTimeout(() => {
        targetInput.focus();
        // 给输入框设置光标位置，让系统识别为需要输入的操作
        if (targetInput.setSelectionRange) {
          const len = targetInput.value.length;
          targetInput.setSelectionRange(len, len);
        }
      }, 80);
    });
  });
  

• 方案三：调整Capacitor/Android原生配置
  如果你能修改Capacitor的原生配置，可以试试在项目的capacitor.config.ts（或capacitor.config.json）里添加这个设置，关闭WebView的“键盘唤起需要用户主动点击”限制：

  export default {
    // 其他配置...
    android: {
      keyboardDisplayRequiresUserAction: false
    }
  };
  

  这个配置会让WebView允许通过JS触发focus时直接唤起键盘，刚好适配你的场景，不过要注意别滥用，避免页面加载时意外唤起键盘。

内容来源于stack exchange