iPhone X 弹出输入框隐藏后页面上移不回位问题的解决办法

吴裕超

发布于 2019-08-02 17:11:58

1.4K0

发布于 2019-08-02 17:11:58

文章被收录于专栏：吴裕超吴裕超

现象：简单的说就是iPhoneX页面里有输入框时，点击输入框，无论是否输入内容，点击输入框的完成或者页面其他地方隐藏输入框后，发现页面被整体顶上去了，而输入框的部分要么成黑色要么白色等，页面底部变成了输入框的顶部位置

解决办法：

方法1：

这个问题是ios12的bug，包括在其他app的webview里，只要ios12平台，app由xcode10构建，就会出现，不限于苹果x和xs，解决代码

  $('input').on('blur', this, (ev) => {
       windows.scrollTo(0,0)
});

但是对我的页面没有效果。。。于是找到方法2

方法2：

$('input').on('blur', function() {
    var count = 0;
    var screenHeight = window.screen.height;
    var blurInterval = setInterval(function () {
        $('body').css('min-height', (screenHeight-=10)+'px');
        if (count >= 10) {
            clearInterval(blurInterval);
            $('body').css('min-height', '');
        }
        count++;
    }, 10)
})

完美解决！这次做活动好几个iPhone bug，iphone 10.3.3版本竟然不兼容flex布局，也是醉了。

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2019-08-02 ，如有侵权请联系 cloudcommunity@tencent.com 删除

编程算法