我要评论方案一，通过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
您可能感兴趣的文章:
如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！
网友评论