OTT 前端技术

iOS 键盘拉起隐藏页面适应

1. 背景接受

ios下input框输入时拉起输入法导致页面被压缩

2. 代码

let isIphone =  /ios|iphone/.test(navigator.userAgent)
// 监听键盘收起及弹出状态
document.body.addEventListener("focusout", () => {
  if (isIphone {
    setTimeout(() => {
      document.body.scrollTop = document.body.scrollHeight
    }, 100)
  }
})

document.body.addEventListener("focusin", () => {
  if (isIphone {
    setTimeout(() => {
      document.body.scrollTop = document.body.scrollHeight
    }, 100)
  }
})