Question

所以我一直在挑选一个javascript游戏教程并试图创建我自己的，但我遇到了一个我不知道如何处理的问题。基本上，玩家可以通过点击在画布内向上拍摄，并且我在其中一个更新功能中使用了mousedown事件来实现这一点。每次发生这种情况时，都应该创建一个小型激光导弹（它的一个新实例被创建并推到一个阵列，激光器上）。出于测试目的，我在游戏中打印了这个阵列中有多少个激光器，而且似乎每次点击鼠标（或者说是向下），它会增加大约20个激光器（有时甚至更多，甚至更多）那）。这是具体的功能：

 canvas.addEventListener('mousedown', function (e) {
        lazers.push(makeProjectile(position.x + width / 2, position.y - height / 2));
 });

我也将整个事情放在jsfiddle上：http://jsfiddle.net/cgC2z/3/

请记住，这段代码有点乱，可能会有悬空。（请随意评论游戏的构建方式，不过，我会喜欢任何建设性的批评）。

Answer 1

您正在update函数中添加事件侦听器。因此，每次更新都会添加另一个事件侦听器。然后点击时，它们全部被触发。

只需移出事件监听器：http://jsfiddle.net/cgC2z/4/

canvas.addEventListener('mousemove', function (e) {
    var mousePos = getMousePos(canvas, e);
    position.x = mousePos.x;
    position.y = mousePos.y;
}, false);

canvas.addEventListener('mousedown', function (e) {
    lazers.push(makeProjectile(position.x + width / 2, position.y - height / 2));
});

function update(elapsed) {
    for (var i = 0; i < lazers.length; i++) {
        lazers[i].update(elapsed);
    }
}

布局上的Mousedown返回大量实例

1 个答案: