屏幕键盘后不支持ios视口初始比例

Question

我有一个非响应页面需要通过 iframe 包含在内。 为了显示整个 iframe，我使用 javascript 动态设置视口宽度和比例。 当我准备好关闭 iframe 时，我将视口宽度和比例重置为原始值。

通常这可以正常工作。 但是，如果打开屏幕键盘（例如，在文本输入焦点上）iOS 拒绝接受任何进一步的缩放。它将尊重视口调整大小，而不是初始比例。 有趣的是，如果您旋转设备，它最终会遵循初始比例。

我认为这可能只是一个 iOS 错误。任何建议将不胜感激。

Answer 1

所以看来诀窍只是再次触发键盘。一旦键盘打开，您设置的视口比例将立即生效。

让键盘弹出说起来容易做起来难。基本上你必须处理一个真正的单击事件或 mouseup 事件，然后直接从单击处理程序（http://jsfiddle.net/DLV2F/87/）触发文本输入焦点。

<input>
<p id="click">Click handler</p>
<p id="click-timeout">Click handler setting timeout</p>
<p id="mousedown">Mousedown handler</p>
<p id="mousedown-timeout">Mousedown handler setting timeout</p>
<p id="mouseup">Mouseup handler</p>
<p id="mouseup-timeout">Mouseup handler setting timeout</p>
<p id="extern-click-trigger">Clicking here will trigger click on the first 'Click Handler'</p>
<p id="tap">Virtual 'TAP' handler</p>
<p id="tap-triggering-click">Virtual 'TAP' handler triggering click on the first 'Click handler'</p>

<script>
function focus() {
    $('input').focus();
}
$(focus);
$(function() {
    $(document.body).load(focus);
    $('#click').click(focus);
    $('#click-timeout').click(function() {
        setTimeout(focus);
    });
    $('#mousedown').mousedown(focus);
    $('#mousedown-timeout').mousedown(function() {
        setTimeout(focus);
    });
    $('#mouseup').mouseup(focus);
    $('#mouseup-timeout').mouseup(function() {
        setTimeout(focus);
    });
    $('#extern-click-trigger').click(function() {
        $('#click').click();
    });
    $('#tap').bind('tapone', function() {
        focus();
    });
    $('#tap-triggering-click').bind('tapone', function() {
        $('#click').click();
    });

});
</script