微信 6.7.4 更新以后导致 Input 文本框失去焦点，IOS 软键盘缩回去页面没有缩回去

  • Z时代
  • 2024-01-10
  • 分类：IT

据测试返回的信息，这个问题只有 IOS 有，安卓端并没有这个 Bug，软键盘弹起后，若原输入框被遮挡，页面整体将会上移，然而当输入框失焦，软键盘收起后，页面未恢复，下面会有一片白色的空白区域。

微信 6.7.4 更新以后导致 Input 文本框失去焦点，IOS 软键盘缩回去页面没有缩回去

当我们稍微滑动下页面就恢复了正常的情况，所以我们可以在文本失去焦点的时候，用 JavaScript 去滑动下页面，问题就解决了，但是页面可能会闪一下：

$("input,select").blur(function(){
  setTimeout(() => {
  const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
  window.scrollTo(0, Math.max(scrollHeight - 1, 0));
  }, 100);
})

更近一步，我们可以判断用户是 IOS 还是安卓，是在微信里面还是普通的浏览器里面：

var wechatInfo = navigator.userAgent.match(/MicroMessenger\/([\d\.]+)/i);
var wechatVersion = wechatInfo[1]
var u = navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if(wechatVersion>'6.7.4'&&!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)){
}

以上是 微信 6.7.4 更新以后导致 Input 文本框失去焦点，IOS 软键盘缩回去页面没有缩回去 的全部内容， 来源链接： utcz.com/p/232050.html

回到顶部