ios - 如何在 Mobile Safari 中确定 iOS 键盘的尺寸

Question

我目前正在尝试在针对 Mobile Safari 的网页中创建建议 UI。主要组件是一个文本框和一个滚动列表，该列表显示在包含建议列表的文本框下方。

为此，我需要 1) 确定键盘已显示，以及 2) 确定其大小以调整建议列表的大小以适应可用空间。

我已经能够通过等待焦点事件来完成 (1)，但 (2) 仍然存在问题。我还没有找到任何方法来测量键盘的大小，因为它似乎不会影响窗口尺寸或我能想到的任何其他尝试测量的尺寸。

当 iOS 键盘显示在移动版 safari 中时，有没有办法以编程方式确定它的大小？

Answer 1

不幸的是，没有办法计算键盘的高度。当键盘出现时，所有窗口属性都不会改变。

要确定键盘是否显示，您可以使用以下解决方案: iPad Web App: Detect Virtual Keyboard Using JavaScript in Safari?

然后您需要添加一个特定于设备的类，并在您的 CSS 中使用媒体查询以及这些类来为设备和方向设置适当的样式。

如果有人有更好的 hack，我真的很想听听。