解决输入框被键盘弹起遮挡问题

方案一，通过window的onresize事件，监听窗口变化进行处理

var clientHeight = document.body.clientHeight;
var _focusElem = null;
document.body.addEventListener("focus", function(e) {
    _focusElem = e.target || e.srcElement;
}, true);
window.addEventListener("resize", function() {
    if(_focusElem && document.body.clientHeight < clientHeight) {
        _focusElem.scrollIntoView(true);
    }
});

方案二：h5页面嵌入APP内部，onresize事件触发不了，通过onfocus和onblur的方式手动去处理

var winHeight = $(window).height(); //获取当前页面高度
//键盘弹出之后，页面需要向上滚动的高度
var addHeight = 0;
$('input').focus(function(e){
	var thisHeight = $(this).offset()['top'];//获取当前input框距页面顶部的高度
    var u = navigator.userAgent;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
    if(isAndroid){
    	if(thisHeight>winHeight/2){
    		addHeight = thisHeight - winHeight/2 + 200
    		$('body').height( $('body').height()+addHeight)
        	$('body').scrollTop(addHeight)
    	}
    }
})
// 失去焦点时重新回到原来的状态
$('input').blur(function(e){
    var u = navigator.userAgent;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
    if(isAndroid){
    	if(addHeight){
    		$('body').height( $('body').height()-addHeight)
        	$('body').scrollTop(0)
    	}
    }
})

本文地址：https://blog.csdn.net/weixin_40970987/article/details/108822244