解决mui app调起手机键盘，界面内容向上移动 || h5底部输入框被键盘遮挡问题

最新推荐文章于 2023-07-18 10:26:18 发布

原创最新推荐文章于 2023-07-18 10:26:18 发布 · 574 阅读

0 ·

CC 4.0 BY-SA版权

这段代码主要用于处理移动端网页在软键盘弹起和收起时窗口高度的变化。通过获取原始窗口高度并比较resize后的高度，当窗口被挤压（resizeHeight小于originalHeight）时，调整当前Webview的高度为原始高度，以防止内容被遮挡。

 //获取原始窗口的高度
		var originalHeight = document.documentElement.clientHeight || document.body.clientHeight;

		window.onresize = function() {

			//软键盘弹起与隐藏  都会引起窗口的高度发生变化
			var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;

			if (resizeHeight * 1 < originalHeight * 1) { //resizeHeight<originalHeight证明窗口被挤压了

				plus.webview.currentWebview().setStyle({
					height: originalHeight
				});

			}
		}