检测虚拟键盘与硬件键盘 [英] Detect virtual keyboard vs. hardware keyboard

问题描述

我一直在考虑这个问题，我无法想办法解决这个问题。有没有办法检测用户是否使用虚拟（软件）键盘或传统（硬件）键盘？

I have been thinking about this a while now, and I can't figure a way to deal with it. Is there any way to detect if the user uses a virtual (software) keyboard or a traditional (hardware) keyboard?

新的Windows Surface在封面上有自己的键盘，对于Android / iPad，有大量不同的蓝牙键盘。

The new Windows Surface has its own keyboard in the cover, and for Android / iPad there are a ton of different bluetooth keyboards.

那么，你们有没有任何关于此的输入？

I我的目标是Android，IOS和Windows平板电脑/手机。

So, do any of you have any input about this?
I'm aiming for Android, IOS & Windows Tablet/Phone.

动机：（非常主观）

在开发平板电脑/智能手机的网络应用程序时，我已经认识到在许多情况下使用JavaScript键盘而不是操作系统的软件键盘会更容易。

When developing web applications for tablet/smartphone I have come to the understanding that it's easier - in many situations - to use a JavaScript keyboard instead of the OS's software keyboard.

假设您要输入PIN码。而不是让键盘填满屏幕的一半：

Lets say you want to enter a PIN code. Instead of having a keyboard filling half of the screen:

软件（OS）键盘：

|----------------|
|    [ input]    |
|                |
|----------------|
|  1  2  3  4  5 |
|  6  7  8  9  0 |
|----------------|

JavaScript键盘：

JavaScript keyboard:

|----------------|
|    [ input]    |
|    | 1 2 3|    |
|    | 4 5 6|    |
|    |_7_8_9|    |
|                |
|                |
|----------------|

如果您需要处理大量输入，也许您想要覆盖 div 输入并使用软件键盘：

If you need to handle a lot of inputs, maybe you want to make an overlaying div with the inputs and use the software keyboard:

|----------------|
| P1 P2    P3 P4 |
| [inp 1][inp 2] |
|----------------|
|    KEYBOARD    |
|                |
|----------------|

但如果用户有自己的硬件键盘，我们希望将编辑内联到位。

But if the user has their own hardware keyboard, we want to make the edit inline in place.

我一直在寻找SO并发现这篇文章： iPad Web App：在Safari中使用JavaScript检测虚拟键盘？ ......但这种接缝仅适用于IOS - 不确定浏览器。

I have been looking around SO and found this post: iPad Web App: Detect Virtual Keyboard Using JavaScript in Safari? ... but this seams to only work in IOS - not sure about browser.

推荐答案

我不认为覆盖默认的屏幕键盘是一个好主意，我想建议按照Jani的建议 - 虚拟键盘也适应。

I don't think overriding default onscreen keyboard is a good idea, and I'd recommend going with what Jani suggested - virtual keyboards adapt too.

但我确信可以通过调整大小来检测大多数键盘事件配对焦点在该字段上或通过监视 window.innerHeight （或其他一些[az] *高度）并比较字段焦点前后的值。

But I'm sure it is possible to detect most keyboards with the resize event paired with focus on the field or by monitoring window.innerHeight (or some other [a-z]*Height) and comparing value before and after field focus.

这是一个奇怪的特征检测案例，所以它需要大量的实验。如果我是你，我不会这样做。

This is a weird case of feature detection, so it will need plenty of experimentation. I wouldn't do it if I were you.

这篇关于检测虚拟键盘与硬件键盘的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！