码迷,mamicode.com
首页 > 移动开发 > 详细

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

时间:2019-10-17 14:06:54      阅读:217      评论:0      收藏:0      [点我收藏+]

标签:ros   soft   on()   get   bar   cto   键盘   固定   oid   

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%‘)

}

})
}

 

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

标签:ros   soft   on()   get   bar   cto   键盘   固定   oid   

原文地址:https://www.cnblogs.com/yangwenbo/p/11691318.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!