如何在 iOS 11.3 Safari 中禁用视口缩放？答案

【问题标题】：How to disable viewport zooming in iOS 11.3 safari?如何在 iOS 11.3 Safari 中禁用视口缩放？
【发布时间】：2026-01-13 06:00:02
【问题描述】：

我已经尝试了所有（是的！！！）question 中的所有解决方案，但似乎没有任何东西适用于 iOS 11.3？

有人在使用 ios 11.3 防止捏缩放方面取得了成功吗？ PS：我知道有充分的理由不防止捏缩放......但我别无选择。非常感谢提前和对不起我的英语。

【问题讨论】：

“……似乎什么都没有发生”。好（我说，在 iPad 上写作）。 ;-) 捏缩放是一个很好的辅助功能，所以你应该捍卫它。
@RobG 我知道，我知道 ;-) ... 。但是客户就是客户……有时他们是 ähhhh... 拒绝任何建议。
我（毫无疑问这里的每个人）都感受到了你的痛苦。我提供评论作为支持，而不是批评。 ;-)
@RobG 是否会在 Safari 中设置一个允许您启用捏缩放的设置，这对每个人来说都是一个更好的解决方案？有时有必要不允许捏缩放来维护基于 Web 的应用程序的功能。并非所有人都希望构建只能通过 Apple 网上商店“访问”的应用程序。

【解决方案1】：

请注意，这些选项中的大多数会破坏许多功能并且不利于可访问性等，但某些应用程序，特别是多点触控 PWA 需要禁用这些功能。使用风险自负。

关于已尝试链接中所有解决方案的父评论，请注意“注意，如果任何更深层次的目标在事件上调用 stopPropagation，事件将不会到达文档和此侦听器不会阻止缩放行为。”- 这是关键。

添加此脚本标签适用于 iOS 11.3 Safari（在 iPhone SE 上测试）

<script>
    document.addEventListener('touchmove',
        function(e) {
            e.preventDefault();
        }, {passive:false});
</script>

当然，您随后必须处理所有触摸输入（如果您需要自定义的多点触控 PWA，那么无论如何您都必须这样做）。

需要注意的是，这种方式禁用了滚动（也许有解决方法？）但是当您需要单屏 PWA 时，这是一个加分项。
另一个警告是，对于类似 PWA 的行为，内容本身最多需要
```
height:100%
```
这样 Safari 中的顶部和底部栏（URL 和底部导航）不会截断任何内容（至少在纵向上）。
最后一个警告是，双击缩放在此模式下仍然有效。禁用它的最佳方法是在根节点上设置以下内容
```
touch-action:manipulation;
```
但是，这仅在根节点可单击时有效，因此向元素添加一个空的 onclick 处理程序。

最后，因为节点现在是可点击的，它可能有你可能不想要的按钮的半透明覆盖层，可以隐藏
```
-webkit-tap-highlight-color: rgba(0,0,0,0);
```

【讨论】：

【解决方案2】：

只需将touch-action: pan-y 样式添加到body 标记即可。这应该可以防止缩放。

【讨论】：