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

Question

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

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

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

在移动 safari 中显示 iOS 键盘时，是否可以通过编程方式确定其大小？

Answer 1

很遗憾，没有办法计算键盘的高度。当键盘出现时，任何窗口属性都不会改变。

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

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

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