移动端 input 输入框获取焦点后无法立即滚动到可视区域

Question

input 输入框获取焦点后无法立即滚动到可视区域,只有输入内容后才会滚动到可视区域.想要获取焦点后立即滚动到可视区域应该怎么实现?

Answer 1

解决方案如下:

window.addEventListener('resize', () => {
    const activeElement = document.activeElement
    if (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA') {
        setTimeout(() => {
          activeElement.scrollIntoView()
        }, 100)
      }
    })