移动端输入框获取焦点后,虚拟键盘弹起,把固定的底部也顶起来了

时间:2022-04-01 18:49:35

var homeFootBar = document.querySelector("底部foot")
var shortcutVal = document.querySelector("input")
shortcutVal.addEventListener("focus", function (e) {
if(navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)){
focusInput()
}
})

/*屏幕的高度*/
let docHeight = window.innerHeight //
function focusInput() {
console.log("安卓手机2")
window.addEventListener(‘resize‘, function() {
console.log("安卓手机3", winHeight "===" window.innerHeight)
if (docHeight> window.innerHeight) {

/*安卓手机当键盘弹起时设置页面的高度为屏幕的高度*/
 homeFootBar.style.display = ‘none‘
console.log("安卓手机底部消失")
document.getElementsByTagName(‘body‘)[0].setAttribute(‘height‘, winHeight ‘px‘)

}else {
/*当键盘收起时*/
homeFootBar.style.display = ‘block‘

document.getElementsByTagName(‘body‘)[0].setAttribute(‘height‘, ‘100%‘)

}

})
}