web中ios移动端软键盘收起后，页面内容留白不下滑

最新推荐文章于 2019-09-23 17:54:00 发布

weixin_30294295

最新推荐文章于 2019-09-23 17:54:00 发布

阅读量223

点赞数

原文链接：http://www.cnblogs.com/wind-wang/p/10737424.html

版权

微信里面打开web页面，在ios软键盘收起时，页面键盘位置的内容留白，如下图

这个问题纠结了很久，然后请教了老大（威哥），看到页面老大给出的方案就是代码改变滚动条的位置。

这里就监听键盘收起的事件，来改变滚动条位置。

//这里区分系统方法和键盘弹出和收起在前两篇文章有记录

document.body.addEventListener('focusout', this.focusoutFunc); //软键盘收起的事件处理

let _isIOS  = -1；

export function isIOS() {
  if (_isIOS === -1) {
    _isIOS = /iPhone|iPod|iPad/i.test(ua) ? 1 : 0;
  }
  return _isIOS === 1;
}

//软键盘弹出的事件处理 
focusoutFunc = () => {
    //isIOS函数在前面
    if (isIOS()) {
       window.scrollTo(0,0)
    }
 }

转载于:https://www.cnblogs.com/wind-wang/p/10737424.html

关注