对象中的Javascript键盘事件

我让键盘以一种简单的方式工作：

rightPressed = false;

onKeyDown = function(pressEvent) {
  if (pressEvent.keyCode == 39) rightPressed = true;
}
onKeyUp = function(pressEvent) {
  if (pressEvent.keyCode == 39) rightPressed = false;
}

$(document).keydown(onKeyDown);
$(document).keyup(onKeyUp);

它成功了。然后我试着把这些都放在课堂上：

function Tkeyboard(){
this.rightPressed = false;

this.onKeyDown = function(pressEvent) {
  if (pressEvent.keyCode == 39) { this.rightPressed = true; alert("boom!"); }
}
this.onKeyUp = function(pressEvent) {
  if (pressEvent.keyCode == 39) { this.rightPressed = false; }
}

$(document).keydown(this.onKeyDown);
$(document).keyup(this.onKeyUp);
}

在初始化过程中，我创建了一个对象：

keys = new Tkeyboard;

在主循环中，我执行以下操作：

if ( keys.rightPressed ) { rx+=1;}

现在它失败了。问题的有趣之处在于调用了警报（“boom！”），所以变量也应该被修改

如果您有任何想法，我将不胜感激。

在中的事件处理程序中（以及在DOM事件中），

此

指订阅事件的元素（

示例中的文档

）。如果要引用原始对象，请使用

function Tkeyboard(){
    var self = this;
    this.rightPressed = false;

    this.onKeyDown = function(pressEvent) {
      if (pressEvent.keyCode == 39) { self.rightPressed = true; alert("boom!"); }
    }
    this.onKeyUp = function(pressEvent) {
      if (pressEvent.keyCode == 39) { self.rightPressed = false; }
    }

    $(document).keydown(this.onKeyDown);
    $(document).keyup(this.onKeyUp);
}

---

keydown/up回调在实际运行时会丢失其原始作用域。您将需要调用

this

。在中，您将执行以下操作：

function Tkeyboard() {
    this.rightPressed = false;

    $(document).keydown(this.onKeyDown.bind(this));
    $(document).keyup(this.onKeyUp.bind(this));
}

Tkeyboard.prototype.onKeyDown = function(pressEvent) {
  if (pressEvent.keyCode == 39) { this.rightPressed = true; alert("boom!"); }
};
Tkeyboard.prototype.onKeyUp = function(pressEvent) {
  if (pressEvent.keyCode == 39) { this.rightPressed = false; }
};

这应该是相似的

---

如果您需要了解如何构建一个完整的键盘类，请查看。

此

设置为从中调用事件处理程序的DOM元素（在本例中为

文档）。通常，
此
未绑定到javascript中的对象：

var a = {
    f: function () {}
};
var b = { f: a.f};
var f = a.f;
a.f(); // this === a
b.f(); // this === b
f(); // this === window

一种常用的解决方法是将
此
绑定到包装器函数：

function bind(func, that) {
    return function() {
        func.apply(that, arguments);
    }
}

//...
$(document).keydown(bind(this.onKeyDown, this));

或者可以使用闭包：

function Tkeyboard() {
    var that = this;
// use 'that' from here on

您可以启动新功能，它将正常工作

    function Tkeyboard() {
    this.rightPressed = false;
    this.onKeyDown = function (pressEvent) {
        if (pressEvent.keyCode == 39) {
            this.rightPressed = true;
            console.log(this.rightPressed )
            alert('boom')
        }
    }
    this.onKeyUp = function (pressEvent) {
        if (pressEvent.keyCode == 39) {
            this.rightPressed = false;
            console.log(this.rightPressed )
        }
    }

    this.events = function(){
        document.addEventListener('keydown', this.onKeyDown);
        document.addEventListener('keyup', this.onKeyUp);

    }
}
const keys = new Tkeyboard;
keys.events();

可能重复的