iOS7用Javascript检测键盘高度？

Question

现在这个问题已经在这里出现了(What is the height of iPad's onscreen keyboard?)，但是我认为由于iOS7最近被发布，它需要更新。

问题：，我有一个固定位置模式，出现在页面右下角。它有一个表单字段，在模态打开时获得焦点。焦点触发软键盘打开。问题是，我想通过编程检测键盘高度，将模态定位在键盘顶部，否则部分模态会从视图中被切断。

我尝试过的：

    var scrollHere = currentWidget.offset().top;
    //this scrolls the page to the top of the widget, but the keyboard is below.
    setTimeout(function() {
        $('html, body').scrollTop(scrollHere);
    }, 0);

页面滚动到模式的顶部。不理想，因为有时表单字段隐藏在键盘下面。

我也试过提醒window.innerHeight

    alert(window.innerHeight);

但无论键盘是否可见，结果都是一样的。

所以我的问题是，有没有人找到一种方法来检测iOS7键盘的高度在JavaScript中？有什么解决办法吗？不太可能，但这可能是iOS7 safari中的一个bug吗？

任何帮助都将不胜感激。谢谢。

Answer 1

所以答案是，我不能检测到window.innerHeight的变化是错误的。

我无法检测到更改的原因是，在iPad上，键盘从底部向上移动，不会触发窗口调整大小事件。我的解决办法不是检测窗口的大小，我让身体的最大高度达到100%，当模态打开时。然后，我等待用户专注于文本字段，并在此时操作滚动位置：

$(document.body).on('focus', '.input-field', function(){
    setTimeout(function(){
         window.scrollTo(0, $('#modalInput').offset().top - 100);
    }, 0);
});

这是当您专注于输入字段时使用的。当键盘打开时，iOS喜欢尝试将窗口集中在字段上，如果在用户需要看到的输入上面有信息，这可能会很烦人。上面的例子滚动窗口，使我的文本字段就在键盘上。你可能会认为这是你所需要做的，但iOS有时会试图变得过于聪明。当用户开始输入输入时，它会重新集中在输入上！所以我们把上面的代码写成这样：

$(document.body).on('focus keyup', '.input-field', function(){
    setTimeout(function(){
         window.scrollTo(0, $('#modalInput').offset().top - 100);
    }, 0);
});

这样，当用户键入时，滚动位置就不会从您想要的位置改变。

备注：我唯一一次能够检测到window.innerHeight中的变化是在on键事件中，因为此时键盘已经完成动画，并在页面上完全显示。在焦点上，它仍然说innerHeight和没有键盘的一样。