解决安卓内键盘弹起遮住输入框

场景：在一个滚动页面，位于页面下方的输入框，唤起键盘后，输入框不自动上移，被键盘挡在下面
解决思路：当输入框聚焦的时候，让滚动条再滚动键盘的高度
遇到的坑：

1. 让滚动条滚动，是设置父元素的滚动距离scrollTop，父元素高度100vh，子元素高度100px，对父元素设置scrollTop才会滚动，因为滚动条是父元素的，一开始给子元素设置scrollTop，死活设置不上
2. 思路是让聚焦的时候让滚动条再滚动键盘的高度，但是不是所有情况下都是要滚动的，因为页面是滚动的，当输入框在底部的时候滚动是没问题的，但是用户手动把输入框滚动到上面，此时聚焦再滚动，输入框就会被推上去的外面去了，此时照样看不见滚动条了，所以需要判断输入框的位置，输入框在可视区的上半部分的时候是不需要滚动的，下半部分才需要滚动，如果输入框比较高，还要算上输入框的高度

let clientHeight = document.body.clientHeight //屏幕高度
let clientTop = document.getElementsByClassName(type)[0].getBoundingClientRect().y + document.getElementsByClassName(type)[0].clientHeight/2
// getBoundingClientRect().y是目标到屏幕上方边界到距离
// document.getElementsByClassName(type)[0].clientHeight/2 目标到高度到一半
//只有输入框在屏幕下半部分到时候才会滚动
if (clientTop > clientHeight/2) {
    let keybord = clientHeight * 0.4 //键盘高度：预估屏幕的0.4
    let top = document.getElementsByClassName('container')[0].scrollTop //当前滚动条到位置
    document.getElementsByClassName('container')[0].scrollTop = keybord + top //在当前的基础上再滚动键盘的高度    
}

WechatIMG849.jpeg