当用户从iPhone / iPad登录我的应用程序时,Safari(帮助)放大,同时用户填写用户名/密码字段.但是当提交表单并将其登录时,我们不会重新加载页面(这是单页面应用程序),因此永远不会重置缩放.所以应用程序总是以放大的比例开始.
我已经查看了Jeremy Keith’s solution,它成功地重置了缩放,但也阻止了用户将来进行缩放/缩放,因为他设置了视口的最大比例.
像这样：
var viewportMeta = document.querySelector('Meta[name="viewport"]'); if (viewportMeta) { viewportMeta.content = 'width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0'; }
有没有人看到一个很好的解决方案,在表单提交后重新设置,之后没有冻结视口？
解决方法
我发现工作有点hacky,但似乎有效.基本上,在表单提交时,我设置了最大比例,然后立即删除它.希望这有助于某人.
element.on('submit',function(event) {
if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {
var viewportMeta = document.querySelector('Meta[name="viewport"]');
if (viewportMeta) {
viewportMeta.setAttribute('content','width=device-width,initial-scale=1.0');
viewportMeta.setAttribute('content',initial-scale=1.0');
}
}
}
