重置视口使用Javascript在iOS10上缩放

Question

我有一个页面,我需要重置视口缩放(缩放缩放)命令,将其设置回初始缩小状态.

看起来像重写元视口的旧尝试和真实的方法:

const viewportmeta = document.querySelector('meta[name="viewport"]');
viewport.attr('content', "initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0");

似乎对ios10没有任何影响(页面仍然放大).有没有办法解决？

更新

.attr是一个jquery方法,我把它留在原始问题中的错误(应该是setAttribute我尝试了一堆不同的东西来使这个工作).问题仍然存在.我在这里建了一个演示页面.

在iOS 10+放大到目前为止,像这样:

当缩放超过设备宽度时更改视口不会在更改视口元标记时缩小.这确实(在Chrome浏览器至少)在Android上工作.

Answer 1

问题

1. attr()不是 JavaScript 函数。这是一个 jQuery 方法。
2. 您正在使用viewportmeta获取meta标签，然后尝试将属性设置viewport为未声明的变量。

解决方案

由于您使用的是 JavaScript，请改用setAttribute方法。

句法 ：

const viewportmeta = document.querySelector('meta[name=viewport]');
viewportmeta.setAttribute('content', "initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0");

片段

const viewportmeta = document.querySelector('meta[name=viewport]');
viewportmeta.setAttribute('content', "initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0");

let viewportmeta = document.querySelector('meta[name="viewport"]');

viewportmeta.setAttribute('content', "initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0");
console.log(document.querySelector('meta[name="viewport"]'));

content如果meta[name=viewport]存在于页面中，它将设置为打开。

如果<meta name="viewport".../>页面中没有，请创建一个，用于setAttribute设置name=viewport并将其附加到头部。

工作片段

<meta name="viewport" />