H5阻止虚拟键盘弹出

适用场景

扫码枪扫码时，会在获取光标的输入框里自动填入扫出来的值，但是又不需要弹出虚拟键盘

解决方案

以vue3代码为例子，为input绑定focus和click事件。在获取光标时将给input设置readonly属性。click事件也要处理，这是为了处理输入框已经获取了光标，但是用户会在点击输入框的情况

vue

<template>
 <input @focus=stopKeyBoard @click=stopKeyBoard/>
</template>

<script setup>
const stopKeyBoard = (e) => {
  const dom = e.target.querySelector('input')
  dom.setAttribute('readonly', 'readonly') // 设置 input 为只读
  setTimeout(function () {
    dom.removeAttribute('readonly') // 去掉只读属性
  }, 200)
}
</script>