我看了多个答案\

在元标签中设置最大比例=1的答案在iOS设备上运行良好，但在Android设备上禁用缩放功能。设置字体大小的字体：16px；onfocus对我来说太粗糙了。

所以我编写了一个JS函数来动态更改元标记。

var iOS = navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);
if (iOS)
    document.head.querySelector('meta[name="viewport"]').content = "width=device-width, initial-scale=1, maximum-scale=1";
else
    document.head.querySelector('meta[name="viewport"]').content = "width=device-width, initial-scale=1";

这对我有用：

input, textarea {
    font-size: initial;
}

我使用了上面Christina的解决方案，但对引导程序进行了小修改，并将另一条规则应用于桌面计算机。Bootstrap的默认字体大小为14px，这会导致缩放。下面将Bootstrap中的“表单控件”更改为16px，以防止缩放。

@media screen and (-webkit-min-device-pixel-ratio:0) {
  .form-control {
    font-size: 16px;
  }
}

对于非移动浏览器，返回到14px。

@media (min-width: 768px) {
  .form-control {
    font-size: 14px;
  }
}

我尝试使用.formcontrol:focu，它将其保持在14px，但focus将其更改为16px，它没有解决iOS8的缩放问题。至少在我使用iOS8的iPhone上，字体大小必须是16px才能对焦，这样iPhone才能不缩放页面。

正如许多其他答案已经指出的那样，这可以通过向元视口标记添加最大比例来实现。然而，这会导致在Android设备上禁用用户缩放功能。（自v10以来，它不会在iOS设备上禁用用户缩放。）

当设备为iOS时，我们可以使用JavaScript动态地向元视口添加最大比例。这实现了两全其美：我们允许用户缩放，并防止iOS缩放到聚焦的文本字段。

| maximum-scale             | iOS: can zoom | iOS: no text field zoom | Android: can zoom |
| ------------------------- | ------------- | ----------------------- | ----------------- |
| yes                       | yes           | yes                     | no                |
| no                        | yes           | no                      | yes               |
| yes on iOS, no on Android | yes           | yes                     | yes               |

代码：

const addMaximumScaleToMetaViewport = () => {
  const el = document.querySelector('meta[name=viewport]');

  if (el !== null) {
    let content = el.getAttribute('content');
    let re = /maximum\-scale=[0-9\.]+/g;

    if (re.test(content)) {
        content = content.replace(re, 'maximum-scale=1.0');
    } else {
        content = [content, 'maximum-scale=1.0'].join(', ')
    }

    el.setAttribute('content', content);
  }
};

const disableIosTextFieldZoom = addMaximumScaleToMetaViewport;

// https://stackoverflow.com/questions/9038625/detect-if-device-is-ios/9039885#9039885
const checkIsIOS = () =>
  /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;

if (checkIsIOS()) {
  disableIosTextFieldZoom();
}

将用户scalable=0添加到视区元，如下所示

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">

为我工作：）

正在iOS 7上运行的Javascript黑客。这是基于@dlo的回答，但mouseover和mouseout事件被touchstart和touchend事件替换。基本上，该脚本在再次启用缩放之前添加半秒超时，以防止缩放。

$("input[type=text], textarea").on({ 'touchstart' : function() {
    zoomDisable();
}});
$("input[type=text], textarea").on({ 'touchend' : function() {
    setTimeout(zoomEnable, 500);
}});

function zoomDisable(){
  $('head meta[name=viewport]').remove();
  $('head').prepend('<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0" />');
}
function zoomEnable(){
  $('head meta[name=viewport]').remove();
  $('head').prepend('<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=1" />');
}