我制作了一个带有<input>标签的HTML页面type="text".当我在iPhone上使用Safari点击它时,页面变大(自动缩放).有人知道如何禁用它吗？
我已经在这个问题上苦苦挣扎了一个多星期了,非常感谢我能得到的任何帮助.我会按照我的理解解释这个问题,但如果我说错了,请纠正.
在iOS 7.0.x中,当键盘显示时,Web视图已调整大小,以便键盘所占用的区域不被视为视口窗口大小的一部分.直到7.0,Cordova Keyboard插件处理此Web视图大小调整.由于7.0本地处理键盘以所需的方式显示,因此该提交shrinkView的config.xml文件的Keyboard 选项变为"No-op":
https://github.com/apache/cordova-plugins/commit/20215013bf91b659b73d5f428ae91dd58be1273a
但是,在7.1中,键盘占用的区域出现在Web视图上.这有一个痛苦的副作用.假设你想在<div>textarea区域前面添加一个(比如留下评论或聊天回复),即;
<body>
<div id="app">...</div>
<div id="reply">
<textarea></textarea>
</div>
</body>
示例CSS:
body {
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
overflow: hidden;
}
#reply {
position: absolute;
bottom: 0;
left: 0;
right: 0;
}
无论何时聚焦或输入文本区域,Web视图都将本地重新定位输入字段.由于Web视图仍然考虑了屏幕的整个高度,因此div不会保持固定在底部,从而打破了布局.
我尝试过以下的事情:
与身体和固定div的CSS一起.固定/绝对位置似乎没有什么区别.为身体设置明确的高度不会做任何事情.
元视口选项的所有可能组合.这就是我目前使用的:
<meta name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1, width=device-width, height=device-height, minimal-ui" />
取消注释cordova键盘插件中的"No-op".这仍然像在iOS 7.0.x中那样打破了布局.
其对JS事件侦听器input和focus事件,以保持计算底部偏移量保持在div底部.这非常激动,因为它与输入字段居中的本机Web视图行为作斗争.
在显示/隐藏键盘后更改元标记以设置显式高度.
我正在使用Cordova 3.4.0-0.1.3
还有其他人遇到过这个问题吗？任何解决方案或想法？
在iOS 6中一切正常.键盘打开并将输入移动到视图中.当键盘关闭时,一切都会回到应有的位置.
在iOS 7中,键盘打开正常,输入仍然在视图中.当键盘关闭时,应用程序的整个下半部分都消失了.我已经将问题跟踪到键盘打开时窗口高度的变化,并且在关闭时不会改变.
在键盘打开之前,窗口高度为568,根据$(window).height(),在打开后,它关闭后为828.文档的高度也相应改变.
我试图阻止窗口调整大小:
$(window).resize(function(e) {
e.preventDefault();
e.stopPropagation();
window.resizeTo(320,480);
return false;
});
我还尝试在键盘关闭后设置尺寸,但没有成功.
我正在使用phonegap 2.7并将KeyboardShrinksView设置为true.