js 能同时监听两个方向键吗, canvas 画图,想控制八方向移动

2021-07-30 21:31:48 +08:00
 zxCoder

网上找了个解决方案,效果不太好

document.onkeydown=function (e){
    console.log(e.key);
    switch (e.key){
        case "ArrowLeft":
            dx-=5;
            break;
        case "ArrowRight":
            dx+=5;
            break;
        case "ArrowUp":
            dy-=5;
            break;
        case "ArrowDown":
            dy+=5;
            break;
    }
}

document.onkeyup=function (e){
    console.log(e.key);
    switch (e.key){
        case "ArrowLeft":
            dx=0;
            break;
        case "ArrowRight":
            dx=0;
            break;
        case "ArrowUp":
            dy=0;
            break;
        case "ArrowDown":
            dy=0;
            break;
    }
}


window.setInterval(()=>{
    // ...
},100);
892 次点击
所在节点    问与答
5 条回复
LifStge
2021-07-30 22:22:20 +08:00
比如换个思路 上下左右不变 再加几个其他按键呢 UI 说明一下就行了 再比如小键盘的九宫格按键
gouflv
2021-07-30 22:50:13 +08:00
监听方式没问题,应该去了解下向量,模拟加速度和合力
joshua7v
2021-07-31 14:18:14 +08:00
你这样对角线速度会快
同楼上,你需要了解向量
codehz
2021-07-31 15:13:37 +08:00
(建议换个模型
你看你可以知道什么时候按下,什么时候释放对吧
所以可以做个对象记录方向键的按下状态,然后再根据这个对象的状态计算加速方向
两层抽象之后这个问题就很简单了
ShaunSS
2021-07-31 19:41:31 +08:00
监听没问题,像素要做下归一不然斜向会动的很快

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/792794

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX