还是有这样的问题，我的页面有两个输入文本，点击输入呼出小键盘时就有很大机率小键盘的区域会变成空白（整个页面高度变小），我现在找到的办法是在点击“登录”按钮时，用focus()把焦点换到另一个输入框，这样整个页面就能恢复正常的高度了。
安卓微信浏览器打开H5页面输入框聚焦键盘弹起时，微信切换到后台运行再切换到前台，键盘自动收起页面留白[图片][图片] 手机：OPPO Reno8 、Android 12 微信版本：8.0.28 代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="Cache-Control" content="no-siteapp" /> <meta name="keywords" content="这里写关键字"> <meta name="description" content="这里写页面描述"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> <meta name="format-detection" content="telephone=no,email=no" /> <title>test</title> <style> body { background: #eee; } .page { padding: 20px; } .u-txt { height: 36px; line-height: 36px; border: #ccc solid 1px; padding-left: 10px; width: 300px; } </style> </head> <body> <div class="page"> <input type="text" class="u-txt" placeholder="输入框" /> </div> </body> </html>
2023-07-28还是有这样的问题，我的页面有两个输入文本，点击输入呼出小键盘时就有很大机率小键盘的区域会变成空白（整个页面高度变小），我现在找到的办法是在点击“登录”按钮时，用focus()把焦点换到另一个输入框，这样整个页面就能恢复正常的高度了。
iOS手机，web页面，当软键盘收起后，页面未下滑恢复，底部有大段空白[图片][图片] （是微信内的web页面，提交问题时非让选框架类型，只能选小程序了）我能说同样的页面在支付宝客户端打开就没问题吗？在ios自带的safari浏览器打开也没问题，希望微信的技术大佬能解决一下这个问题，我看社区在2018年就有人反应过这个问题，这都2020年了，问题依然存在，哎，不说了 不能给测试链接，把测试代码加上吧 <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="format-detection" content="telephone=no" /> <meta name="format-detection" content="email=no" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <meta name="full-screen" content="yes"> <meta name="browsermode" content="application"> <meta name="x5-orientation" content="portrait"> <meta name="x5-fullscreen" content="true"> <meta name="x5-page-mode" content="app"> <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no,minimal-ui"> <link rel="icon" href="<%= BASE_URL %>favicon.ico"> <title>测试代码</title> <style> *{ padding: 0; margin: 0; } html,body{ width: 100%; height: 100%; } #app{ width: 100%; height: 100%; background:#ff8b03; } .section-top{ position: relative; z-index: 1; box-sizing: border-box; width: 100%; padding-top: 300px; } .form-group{ box-sizing: border-box; width: 100%; } .input-group{ box-sizing: border-box; display: flex; height:44px; margin-bottom: 16px; justify-content: space-between; flex-wrap: nowrap; align-items: center; background:rgba(255,240,241,1); border-radius:8px; } .input-item{ text-align: left; flex: 1 1 auto; height: 100%; font-size: 14px; padding: 0 0 0 1em; } </style> </head> <body> <div id="app"> <div class="section-top"> <div class="form-group"> <div class="input-group"> <input class="input-item" maxlength="11" type="tel" placeholder="请输入手机号" /> </div> <div class="input-group"> <input class="input-item" maxlength="4" type="tel" placeholder="请输入短信验证码" /> </div> </div> </div> </div> <script type="text/javascript"></script> </body> </html>
2023-07-28我也遇到了同样的问题，不是小程序，就是普通的h5网页，在微信的浏览器中就有这样的问题，希望有人能回答一下。
平板横屏进入小程序 内嵌的webview中第一个软键盘弹起后，webview页面大小被压缩再不恢复！华为平板进入小程序，小程序采用内嵌webview的方式展示内容，当遇到webview中第一个输入框时，平板软键盘弹起，原来全屏大小的webview页面被压缩，只展示软键盘上方页面内容，软键盘取消后，原来软键盘部分内容空白，之后除非重新进入小程序，否则在这一次浏览中一直保持webview被压缩，下方展示空白的情形。 平板型号：华为MatePad11，HarmonyOS版本：3.0.0 详情可见下图 图1：webview出现的第一个输入框 [图片] 图2：点击会弹出软键盘 [图片] 图3：软键盘消失，webview尺寸被挤压改变，下面展示空白 [图片] 图4：再返回到其他页面，webview一直处于被压缩的状态 [图片] 不知道是不是我代码写的有问题，还是缺少什么配置项，导致出现这样的问题，寻找相似的帖子也没有找到解决办法，虽然很少有用户在平板上横屏这么看小程序，但如果用户一旦这样使用就必现这个问题，非常影响用户使用！请微信官方看一下，感谢！！！！
2023-07-27
获得过 0 次赞
回答过的问题获得 0 次赞
分享过的文章/案例获得 0 次赞
评论与回复获得 0 次赞