Question

我在jquery移动网络应用程序中遇到以下问题。

我的jquery应用程序有一个固定的页脚，但是当Android键盘打开时（即在浏览器栏中单击并手动重新加载页面时），似乎视口仅从顶部（在浏览器栏下方）向下到键盘的上边缘。然后页面重新加载并且视口的高度保持这个大小，所以当键盘再次隐藏时它太小了。如何再次隐藏键盘时强制调整大小？

非常感谢你的帮助。

Answer 1

尝试将此元标记放入标题中。它可能会解决您的问题：

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

Answer 2

使用javascript或css无法避免此行为..请检查此信息link

Answer 3

对于其他遇到Android问题的人来说，我注意到页面会在没有元视口的情况下完全加载，因此尝试动态添加延迟以便Android浏览器等待键盘消失。

var ua = navigator.userAgent.toLowerCase();
var isAndroid = /android/i.test(ua);
if(isAndroid) {
    setTimeout(function(){
        viewport = document.querySelector("meta[name=viewport]");
        viewport.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
    },100);         
} else {
    viewport = document.querySelector("meta[name=viewport]");
    viewport.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
}

根据需要更改超时持续时间，但是太短，并不总是有效。唯一的问题是你在Android上获得了更短的内容。触发orientation更改或调整大小事件以便在键盘消失后重新绘制将是一个更好的解决方案，但我无法通过JS让窗口重新绘制到正确的高度。

Answer 4

尝试绑定resize

上的window事件

安卓键盘显示后jQuery移动页脚或视口大小错误

4 个答案: