关于前端:vueH5解决安卓手机软键盘弹出页面高度被顶起

已测试,可解决问题

const originalHeight=document.documentElement.clientHeight ||document.body.clientHeight;

            window.onresize = ()=>{
                return(()=>{
                    //键盘弹起与暗藏都会引起窗口的高度发生变化
                    const resizeHeight=document.documentElement.clientHeight || document.body.clientHeight;
                    console.log("进入到判断页面高度=========");
                    console.log("页面初始高度========="+originalHeight);
                    console.log("软键盘弹起高度========="+resizeHeight);
                    if(resizeHeight-0<originalHeight-0){
                    //当软键盘弹起,在此处操作
                    console.log("进入到软键盘弹起=========");
                        document.querySelector('body').setAttribute('style', 'height:'+originalHeight+'px;');
                        this.scrollerHeight=resizeHeight;
                    }else{
                    //当软键盘收起,在此处操作
                    console.log("进入到软键盘收起=========");
                    document.querySelector('body').setAttribute('style', 'height:100%;');
                    this.scrollerHeight="100%";
                    }
                })()

            }

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理