js判断组合按键,以方向键为例,当前实列为两个,三个只需自己添加

 1 document.addEventListener('keydown', down)
 2         document.addEventListener('keyup', up)
 3         var downKey = [];      // 存放当前键盘按下的键
 4         var timer = null;      // 周期定时器,用来周期输出按下的状态
 5         var type = '';         // 当前按下的类型
 6         /**
 7         * 判断数组是否包含元素的函数
 8         * @param {Array} arr - 要判断的数组
 9         * @param {Number} value - 要判断的值
10         */
11         function _Includes (arr, value) {
12             if(arr.indexOf(value) === -1){
13                 return false;
14             } else {
15                 return true;
16             }
17         }
18         /**
19         * 判断当前按下状态的函数
20         */
21         function cd () {
22             if (downKey.length === 2) {
23                 // 根据长度取出数组内所有代码进行判断
24                 switch(downKey[0].toString() + downKey[1].toString()) {
25                     // 按下的先后顺序不一定,所以有两种情况
26                      case '3738':
27                      case '3837':
28                          type = '左上'
29                         break;
30                      case '3839':
31                      case '3938':
32                          type = '右上'
33                         break;
34                     case '3940':
35                     case '4039':
36                          type = '右下'
37                         break;
38                     case '3740':
39                     case '4037':
40                          type = '左下'
41                         break;
42                      default:
43                          break;
44                  } 
45             } else if (downKey.length === 1) {
46                 // 只按下一个键
47                 switch(downKey[0].toString()) {
48                      case '37':
49                          type = '左'
50                         break;
51                      case '38':
52                          type = '上'
53                         break;
54                     case '39':
55                          type = '右'
56                         break;
57                     case '40':
58                          type = '下'
59                         break;
60                      default:
61                          break;
62                  }
63             }
64         }
65         /**
66         * 监听按下的函数
67         * @param {Event} e - 事件
68         */
69         function down (e) {
70             // 如果按下键的时候数组为空则开启周期计时器
71             if(downKey.length === 0){
72                 timer = setInterval(function(){
73                     console.log(type);
74                 },200)
75             }
76             // 当前没按下这个键,存入按键数组
77             if (!_Includes(downKey, e.keyCode)) {
78                 downKey.push(e.keyCode);
79             }
80             // 执行判断状态的函数
81             cd();
82         }
83         /**
84         * 监听松开的函数
85         * @param {Event} e - 事件
86         */
87         function up (e) {
88             // 松开按键的时候将其从按键数组里去掉
89             let index = downKey.indexOf(e.keyCode);
90             downKey.splice(index,1);
91             // 执行判断状态的函数
92             cd();
93             // 若当前无按下键则清除定时器
94             if(downKey.length === 0){
95                 clearInterval(timer)
96             }
97         }

 

转载于:https://www.cnblogs.com/passerma/p/11219584.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值