使用 Javascript 在 iPhone Safari 上启用/禁用缩放？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2750028/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Enable/disable zoom on iPhone safari with Javascript?
提问by msqr
I have 1 page which has 2 DIV elements which is shown/hidden based on user click on action buttons with javascript, I would like to toggle scaling on action button click.
我有 1 个页面，其中有 2 个 DIV 元素，这些元素基于用户使用 javascript 单击操作按钮而显示/隐藏，我想在单击操作按钮时切换缩放。
I tried with below javascript and it is changing viewport meta but getting no effect.
我尝试使用下面的 javascript，它正在改变视口元但没有效果。
Any suggestions?
有什么建议？
var ViewPortAllowZoom = 'width=device-width;';
var ViewPortNoZoom = 'width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no;';
function AllowZoom(flag) {
if (flag == true) {
$('meta[name*=viewport]').attr('content', ViewPortAllowZoom);
}
else {
$('meta[name*=viewport]').attr('content', ViewPortNoZoom);
}
}
回答by Erik Z
Removing and re-adding the meta tag worked for me:
删除并重新添加元标记对我有用：
function AllowZoom(flag) {
if (flag == true) {
$('head meta[name=viewport]').remove();
$('head').prepend('<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=10.0, minimum-scale=1, user-scalable=1" />');
} else {
$('head meta[name=viewport]').remove();
$('head').prepend('<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=0" />');
}
}
However, if the user zooms in and then switches to no zoom, the viewport remains zoomed and the user can no longer change the zoom. Does anyone have a solution for that?
但是，如果用户放大然后切换到不缩放，则视口保持缩放并且用户无法再更改缩放。有没有人有解决方案？
回答by Dmitri Kulichkin
$('body').bind('touchmove', function(event) { event.preventDefault() }); // turns off
$('body').unbind('touchmove'); // turns on
回答by Szalai Laci
These are the steps to disable zooming:
这些是禁用缩放的步骤：
- Convince your PM that disabling is a bad idea (see the below article).
- If he still wants it, convince him harder.
- If he still wants it, read this article and add preventDefault to gesturestart as explained in a comment in there: https://wouterdeschuyter.be/blog/how-to-disable-viewport-scaling-in-ios-10-you-dont-941140811
- 说服您的 PM 禁用是一个坏主意（请参阅下面的文章）。
- 如果他还想要，就更努力地说服他。
- 如果他仍然想要它，请阅读这篇文章并将 preventDefault 添加到gesturestart，如评论中所述：https: //wouterdeschuyter.be/blog/how-to-disable-viewport-scaling-in-ios-10-you-不要-941140811
It works in iPhone 6 and doesn't block scrolling.
它适用于 iPhone 6 并且不会阻止滚动。
Thanks for link, Aloober: https://stackoverflow.com/a/41166167/1409261
感谢链接，Aloober：https://stackoverflow.com/a/41166167/1409261
