javascript JQuery keyup() keydown() 和 keypress() 不适用于 iPad 和蓝牙键盘
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21296673/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery keyup() keydown() and keypress() are not working with iPad and bluetooth keyboard
提问by Sean N.
I'm having trouble getting the keyup(), keydown()and keypress()events to work on an iPad. The trouble occurs when I have a wireless bluetooth keyboard connected and try typing using the keyboard -- the events do not fire. I tried with both Safari and Chrome on the iPad (iOS 6.1). This same HTML works fine in Firefox, Safari, Chrome, etc on the desktop. Is there any way to change this code to make it work on the tablet? I checked document.activeElement, and it seems to be the document body, which is correct.
我无法让keyup(),keydown()和keypress()events 在 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>
回答by Sean N.
Well apparently on iOS, the keyboard will not work unless a text field has focus, period.
To work around this, I'm going to need to add a hidden text field to the HTML. Something like this:
那么显然在iOS上，键盘不会工作，除非文本字段具有焦点，期。
为了解决这个问题，我需要向 HTML 添加一个隐藏的文本字段。像这样的东西：
<div style="overflow: hidden; position: relative; width: 1px; height: 1px; left: -500px">
<input id="input" type="textfield" autocorrect="off" autocapitalize="off">
</div>
Now the problem is, there is no way in JavaScript to give the hidden input focus automatically on an iPad. So I'm going to have to add some sort of button that has to be physically clicked on to give the hidden input field focus. See here.
现在的问题是，JavaScript 无法在 iPad 上自动提供隐藏的输入焦点。因此，我将不得不添加某种必须通过物理方式单击才能使隐藏的输入字段获得焦点的按钮。见这里。
<input type="button" value="Click here first" onclick="document.getElementById('input').focus();">
I hate this. If anyone can find a better solution, please let me know.
我讨厌这个。如果有人能找到更好的解决方案，请告诉我。
回答by Reverend Pete
Using jQuery, if you do it with keydown, it works
使用 jQuery，如果你用 keydown 来做，它就可以工作
$("#selector").on("keydown", function(event) { console.log(event.which); });
you get the proper key object returned in the event, with keyCode and which. Weird that it sends a keyup event, but all the relevant data is set to 0.
您将获得事件中返回的正确键对象，包括 keyCode 和 which。奇怪的是它发送了一个 keyup 事件，但所有相关数据都设置为 0。
