JQuery keyup() keydown() 和 keypress() 不适用于 iPad 和蓝牙键盘答案

【问题标题】：JQuery keyup() keydown() and keypress() are not working with iPad and bluetooth keyboardJQuery keyup() keydown() 和 keypress() 不适用于 iPad 和蓝牙键盘
【发布时间】：2014-02-13 07:44:00
【问题描述】：

我无法让keyup()、keydown() 和keypress() 事件在 iPad 上运行。当我连接了无线蓝牙键盘并尝试使用键盘打字时，就会出现问题——事件不会触发。我在 iPad (iOS 6.1) 上尝试了 Safari 和 Chrome。相同的 HTML 在桌面上的 Firefox、Safari、Chrome 等中运行良好。有什么办法可以更改此代码以使其在平板电脑上运行？我查了document.activeElement，好像是文档正文，没错。

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script>
            $(document).ready(function() {
                $(document).keyup(function(event) {
                    document.getElementById("output").innerHTML = document.getElementById("output").innerHTML + ("keyup " + event.which) + "<br>";
                });
                $(document).keydown(function(event) {
                    document.getElementById("output").innerHTML = document.getElementById("output").innerHTML + ("keydown " + event.which) + "<br>";
                });
                $(document).keypress(function(event) {
                    document.getElementById("output").innerHTML = document.getElementById("output").innerHTML + ("keypress " + event.which) + "<br>";
                });
            });
        </script>
    </head>
    <body>
        <div id="output"></div>
    </body>
</html>

【问题讨论】：

我很快在谷歌上搜索了一下，有人用 onKeyPress 代替了运气。
@d_ominic 您有指向您找到的页面的链接吗？我尝试将代码更改为，但它仍然无法在 iPad 上触发。我不想在页面上放置文本输入字段，因为这会导致屏幕键盘弹出。
这篇文章与我遇到的问题相同：javascript-read-keypresses-on-tablet
stackoverflow.com/questions/18985117/…

标签： javascript jquery ios ipad bluetooth

【解决方案1】：

显然，在 iOS 上，除非文本字段具有焦点，否则键盘将无法工作，句号。
为了解决这个问题，我需要在 HTML 中添加一个隐藏的文本字段。像这样的：

<div style="overflow: hidden; position: relative; width: 1px; height: 1px; left: -500px">
<input id="input" type="textfield" autocorrect="off" autocapitalize="off">
</div>

现在的问题是，JavaScript 无法在 iPad 上自动赋予隐藏的输入焦点。因此，我将不得不添加某种必须物理单击的按钮才能使隐藏的输入字段获得焦点。见here。

<input type="button" value="Click here first" onclick="document.getElementById('input').focus();">

我讨厌这个。如果有人能找到更好的解决方案，请告诉我。

【讨论】：

【解决方案2】：

使用 jQuery，如果你用 keydown 来做，它可以工作

$("#selector").on("keydown", function(event) { console.log(event.which); });

您会在事件中返回正确的密钥对象，包括 keyCode 和 which。奇怪的是它发送了一个 keyup 事件，但所有相关数据都设置为 0。

【讨论】：