Android开发中如何将WebView的输入软键盘切换为数字键盘？

问题根因 #

你之前写的代码只改了输入框的内容校验规则，没触发软键盘切换，本质是踩了两个WebView的固有坑：

• 动态修改input标签的type属性时，Android WebView不会主动同步更新和输入法服务通信的InputConnection参数，输入法根本感知不到输入类型变了，还是加载默认的全字母软键盘。
• 单靠type='number'本身适配性极差，不少国产定制ROM、低版本WebView内核根本不会把这个属性当成唤起数字键盘的信号，甚至还会给输入框加个没用的数字上下步进箭头，完全不适合OTP输入场景。

落地解决方案 #

需要同时从H5注入逻辑、Android原生配置两侧调整，才能稳定唤起数字软键盘：

1. 替换原有JS注入代码 #

不要仅修改type属性，需要同时补全软键盘控制属性，改完后主动触发输入框状态刷新，注入的JS代码参考如下：

const targetInput = document.getElementById('otpValue');
if (targetInput) {
  // 同时设置三个属性保证适配性：inputMode是标准的软键盘类型控制属性，优先级最高
  targetInput.type = 'number';
  targetInput.inputMode = 'numeric';
  targetInput.pattern = '[0-9]*';
  // 兜底拦截非数字输入，避免软键盘适配异常时输入非法字符
  targetInput.addEventListener('input', (e) => {
    e.target.value = e.target.value.replace(/[^0-9]/g, '');
  });
  // 触发焦点切换，强制WebView重新读取输入框配置
  targetInput.blur();
  targetInput.focus();
}

2. 调整Android原生侧配置 #

• 检查WebView基础配置，不要强行覆盖输入类型：
  确保WebView开启JS权限，同时不要重写WebView的onCreateInputConnection方法强行设置固定inputType，比如不要写outAttrs.inputType = InputType.TYPE_CLASS_TEXT这类代码，会直接覆盖H5侧传递的数字输入标识。基础配置参考：

  webView.settings.javaScriptEnabled = true
  

• JS执行完成后主动刷新输入法状态：
  在evaluateJavascript的执行回调中主动重启输入法，强制输入法重新读取当前输入框的类型参数，代码参考：

  webView.evaluateJavascript(/* 上述JS代码 */) {
      val imm = webView.context.getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
      // 重启输入法连接，同步最新输入类型
      imm.restartInput(webView)
      // 若软键盘未自动唤起，主动触发显示
      imm.showSoftInput(webView, InputMethodManager.SHOW_IMPLICIT)
  }
  

额外适配提示 #

如果碰到个别顽固机型还是弹全键盘，直接把JS里的targetInput.type = 'number'换成targetInput.type = 'tel'，这个类型在所有Android版本的WebView里都会强制唤起纯数字拨号键盘，适配性比number稳得多，专门适合验证码、手机号这种纯数字输入的场景。

内容的提问来源于stack exchange，提问作者Prakash Jha