HTML5; 检测Javascript中物理键盘的存在

9
什么是检测用户是否有物理键盘的最可靠方法?
一种想法是因为没有物理键盘,window.onkeydown 可能是 undefined(而不是 null)。但由于存在虚拟键盘,我想这不是情况。尽管如此,我还没有进行测试。
我的目标是,如果用户没有物理键盘,则将 在线计时器input[type='number'] 替换为滚轮选择器。

@Shmiddty JavaScript 可能会检测到屏幕阅读器的存在,这意味着用户可能有视觉障碍。 - Phil Lello
4个回答

5
这在像Microsoft Surface这样的设备上变得非常棘手,它配备了键盘、鼠标,并且有一个触摸屏。您可能随时混合所有3种输入模式,或者添加另一种输入方法,如触控笔。
Microsoft采用将输入事件抽象为“指针事件”的方法。该模型已提交给W3C。这应该让您了解管理输入的趋势。
尽管如此,我发现查看触摸是否可用并基于假设操作是很方便的——如果是的话,用户至少会使用触摸输入的一部分时间。这可能导致设计决策,即消除完全不适合触摸的事物,即使这可能意味着妥协鼠标/键盘功能。
在您的特定情况下,我会仔细考虑是否需要用自定义控件替换input[type=number]。大多数触摸设备都是相当现代的,并且许多具有标准HTML输入的自定义、触摸友好版本。
还要记住,本机控件可能支持良好的可访问性场景。
如果您决定实现自定义控件,则我建议检测触摸功能并显示您的自定义控件是否存在其他输入机制。这意味着确保自定义控件至少是触摸/键盘/鼠标友好的。
以下是我的当前触摸测试(免责声明:它明天可能会失效,并且肯定没有在每个设备上进行过测试):
var supportsTouch = ("ontouchstart" in window) || window.navigator.msMaxTouchPoints > 0;

4
我看到两种方法。
第一种方法是监听每个鼠标和键盘事件。使用鼠标的用户很可能也有键盘。访问网站的用户很可能会移动鼠标。
第二种方法是检查用户代理以读取正在运行的操作系统,并假定Android和iOS设备没有任何键盘。对于Windows 8,我不知道用户代理如何帮助,因为Windows 8在平板电脑和台式机/笔记本电脑上都可以运行。
不过,我更喜欢一个更优雅的解决方案。

想象一下连接了蓝牙键盘的Android平板电脑... 目前似乎探测按键事件是唯一可行的解决方法。记录 keydownkeyup 的微秒时间并计算它们之间的差异。如果有波动,很可能正在使用物理键盘。 - Gerald

1

检测触摸屏并显示特殊小部件更加可靠;只需确保键盘仍可用于辅助功能,使您的精美小部件更易访问。


1
你可以通过检查操作系统或屏幕尺寸来确定键盘类型。Android、iOS和所有屏幕较小的设备通常没有物理键盘。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接