Javascript 中的触摸事件看似随机？

Question

我正在用 HTML5 canvas 制作一个游戏，玩家必须控制一只灰狗来捕捉从天而降的鸡。该代码适用于箭头键，但我正在尝试添加触摸事件。当玩家点击并按住灰狗的左侧时，向左移动。在灰狗的右边，向右移动。我目前的代码如下：

document.body.addEventListener("touchstart", function(e) {
        if (e.changedTouches[0].pageX > greyhound.speedX) {
            greyhound.speedX -= 10;
            greyhound.speedY = innerHeight - 100;
        } else {
            greyhound.speedX += 1;
            greyhound.speedY = innerHeight - 100;
        };
        greyhound.newPos();
    }, false);
}

无论我点击哪里，这都会产生看似随机的结果。此外，当我将手指放在屏幕上时，它不会继续移动。欢迎任何帮助或批评。谢谢！

注意：我试图先点击一下让它工作，然后让它在触摸和按住时工作。

Answer 1

这可能是因为当您将手指放在屏幕上时，当您只是在聆听初始触摸时，您期望某些事情会持续发生。我建议将 touch 和 click 处理程序注册到同一个函数，使其工作，然后从那里获取它。

reference on touch events

此外，这有点旁注，但在快速移动的游戏中，在每个像素变化时调用这样的方法不会有超高性能。您可能想研究类似于 debounce type approach

但可能不完全相同的内容

Javascript 中的触摸事件看似随机？

Touch Event In Javascript Seemingly Random?

html

javascript

touch