javascript - 防止 iPhone 在 web-app 中放大 `select`

Question

我有这个代码:

<select>
    <option value="c">Klassen</option>
    <option value="t">Docenten</option>
    <option value="r">Lokalen</option>
    <option value="s">Leerlingen</option>
</select>

在 iPhone 上的全屏网络应用程序中运行。

从该列表中选择某项时，iPhone 会放大 select 元素。并且在选择某些内容后不会缩小。

我该如何防止这种情况发生？还是缩小？

Answer 1

这可能是因为浏览器试图缩放区域，因为字体大小小于阈值，这通常发生在 iphone 中。

提供元标记属性“user-scalable=no”将限制用户在其他地方缩放。由于问题仅出在 select 元素上，请尝试在您的 css 中使用以下代码，此 hack 最初用于 jquery mobile。

HTML:

<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

CSS:

select{
font-size: 50px;
}

来源:unzoom after selecting in iphone