使用 iPhone 浏览器时，如何在键盘折叠后自动触发缩小？

Question

在 iPhone 上使用浏览器时，是否可以在页面中嵌入元标记以在输入字段失去焦点后触发自动缩放回初始大小？我已经在使用这个元标记：

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

正如预期的那样，当用户单击输入字段并在其中输入文本时，它会放大文本字段。问题是，在提交表单后（我使用 ajax 来避免重绘页面）并且键盘折叠，它不会缩小。使用 javascript、HTML and/or 元标记，如何在不重新加载整个页面的情况下将屏幕尺寸恢复到初始尺寸？

我已经在我的 iPhone（版本 6s+、6 和 5）上同时使用 safari 和 firebox 浏览器进行了测试。

否 jquery 请。我只使用 HTML 和 javascript.

Answer 1

当您的应用程序失去焦点时，将触发 blur 事件。模糊基本上是焦点的对立面。触发此事件时，您可以将元标记添加到文档的正文中。

没有 jQuery 版本。

let $inputElement = document.getElementsByTagName('input');
$inputElement.addEventListener('blur', function() { 
    // Add your meta tag
});

以下代码使用 jQuery，但您可以使用原版 javaScript。

let $inputElement = $('input');
$inputElement.on('blur', function() {
    // Add your tag.
});