javascript - jQuery 键盘功能 keyPress

Question

I have the following HTML/CSS to create a simple keyboard.我已经尝试使用 jQuery keyPress() 进行试验，但我似乎无法理解，所以当您按下键盘上的某个键时，相应的字母具有“触发器”类。

例如，当您在 ID 为“input”的文本区域中按 Q 时，ID 为“q”的 span 应将其背景更改为绿色(更改为“trigger”类)

任何帮助将不胜感激，在此先感谢。

编辑

到目前为止，我有一些 Javascript，它会在每次击键时发出警报。看这个example

Answer 1

如果你希望背景只在按下键时改变，你需要在 keydown 上设置它并在 keyup 上设置它:

$(function () {
  $("#input").keydown(function (event) {
      $("#" + String.fromCharCode(event.which)).addClass("trigger");
  }).keyup(function (event) {
      $("#" + String.fromCharCode(event.which)).removeClass("trigger");
  });
});

请注意 keydown 和 keyup 返回键码而不是字符代码，但就字母键而言，将它们视为字符代码是安全的大写字母。 (所以在下面的演示中，我将跨度的 ID 更改为大写，以节省在事件处理程序中进行算术运算。)

演示:http://jsfiddle.net/AHPaY/6/

附言如果您尝试演示，您会发现这也适用于同时按键，例如，同时按住 Q 和 T...