Question

考虑以下代码：

controls = {
  'w': 'up',
  's': 'down',
  'a': 'left',
  'd': 'right'
};

keysPressed = [];

for (control in controls) {
  direction = controls[control];
  $(document).bind('keydown', control, function() {
    keysPressed.push(direction);
  });
}

只有right方向被绑定，并且它被绑定到所有四个键。这显然不是故意的，但是我错过了哪些JavaScript会阻止所有属性被正确绑定？

修改

为了澄清，我使用jQuery.hotkeys来处理密钥名称。这是一个片段;你可以假设所有变量都已声明。此外，代码采用安全function包装。

SOLUTION：

我通过这个修改解决了它：

controls = {
  'w': 'up',
  's': 'down',
  'a': 'left',
  'd': 'right'
};

keysPressed = [];

addToKeyPressArray = function(value) {
  return function() {
    keysPressed.push(value);
  };
};

removeFromKeyPressArray = function(value) {
  return function() {
    keysPressed = keysPressed.filter(value);
  };
};

for (control in controls) {
  direction = controls[control];
  $(document).bind('keydown', control, addToKeyPressArray(direction));
  $(document).bind('keyup', control, removeFromKeyPressArray(direction));
}

这是一个奇怪的JavaScript怪癖。

Answer 1

对我而言似乎很可能是许多人在JS上绊倒的基本“闭环问题”。

通过谷歌可以轻松找到解释和解决方案，例如：http://www.mennovanslooten.nl/blog/post/62

Answer 2

我就是这样做的：

$( document ).keypress( function ( e ) {
    var char = String.fromCharCode( e.keyCode );

    if ( controls[ char ] ) {
        keysPressed.push( controls[ char ] );
    }
});

Answer 3

您没有声明direction变量（使用var），因此它将在全局范围内。这意味着for循环将运行，然后direction将设置为right。

所有键都绑定，但都是

keysPressed.push(direction);
// and that is:
keysPressed.push("right");

我也建议您阅读Jani的帖子（以及相关文章），因为您也可以阅读这个问题。

迭代JavaScript对象以绑定键

3 个答案: