如何在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 中使用媒体查询以及这些类，以针对设备和方向设置适当的样式。

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