Jquery/Javascript：按下组合键时运行一个函数，释放键时运行另一个函数

我想要一些代码，用于需要用户记忆数字的任务。这项任务的工作应如下：

指示用户按下三个键的组合，以显示他们需要记住的号码。这可以是任意三个键，只要它需要用户使用双手（其想法是这样可以防止他们记下他们应该记住的数字）

当他们开始按住按键时，数字显示，计时器启动。如果他们在必要的时间段（15秒）内一直按住按键，则函数会自动运行（这是他们在记住数字时必须执行的另一项任务）

但是，如果他们在15秒之前释放按键，则会运行另一个功能。此功能只是通知他们过早释放按键，当他们单击按钮时，任务将以新的数字重新启动

我当前拥有的代码如下所示：

var mapDown = {}; // Global object to store keydown events
var mapUp = {}; // Global object to store keyup events

此函数使用函数numberFunc（）生成要记忆的随机数（未显示），并运行页面

function keyDownFunc() {
  mapDown = {};
  mapUp = {};
  memoryNum = numberFunc(); 
  $('#experimentDisplay').load('./html/numberTest.html');
  $('#experimentDisplay').show();
}

下面的函数位于上面调用的页面的脚本中。它显示一个名为“numberTestDiv”的div中要记忆的数字。目前（为了简单起见），它被设置为在按下“p”和“q”键时运行

<script>
onkeydown = onkeyup = function(e){
    e = e || event; // to deal with IE
    mapDown[e.keyCode] = e.type == 'keydown';
    mapUp[e.keyCode] = e.type == 'keyup';

    if(mapDown[80] && mapDown[81]) {
       $("#numberTestDiv").html(memoryNum);
       timer = setTimeout(runTrial, 15000);
     }; // run the function runTrial() if the keys are held down for the requisite period

     if (mapUp[80] || mapUp[81]) {
       mapDown = {};
       clearTimeout(timer);
       keyUpFunc(); // stop the timer and run the function keyUpFunc() if either of the keys are released too early
     }

}
</script>

上面提到的有几个问题

1） 如果用户按住键并继续执行主任务，屏幕会闪烁相当长的一段时间——我假设是因为扩展键保持生成的所有事件。我想不出如何避免这种情况。我已经读到修改键自动重复

2） clearTimeout（）函数似乎不起作用。如果用户提前释放键，指向keyUpFunc函数，然后再次启动keyDownFunc函数，则用户无需按住“p”键和“q”键15秒（或根本不按住），即可继续执行runTrial函数

咨询的其他答案包括：

---

添加一个标志，用于存储按住两个按钮的代码是否已在运行，然后将其作为运行代码的条件，应该可以解决您的问题。这基本上可以阻止代码在按住按钮或向上提起按钮时运行数百次。下面是一些示例代码：

var going = 0;
onkeydown = onkeyup = function(e){    
 e = e || event; // to deal with IE
 mapDown[e.keyCode] = e.type == 'keydown';
 mapUp[e.keyCode] = e.type == 'keyup';
  if(going==0){
    if(mapDown[80] && mapDown[81]) {
       going = 1;
       timer = setTimeout(runTrial, 15000);
     }; // run the function runTrial() if the keys are held down for the requisite period
  } else if(going==1){
     if (mapUp[80] || mapUp[81]) {
      going = 0;
      clearTimeout(timer);
      keyUpFunc(); // stop the timer and run the function keyUpFunc() if either of the keys are released too early
     }
  }
}

runTrial = function(){
 going = 0; //This just resets the going value for the next trial. It may not be necessary if you just store going as a local variable and reset it at the start each time. 
 console.log("all done"); // replace this with the correct function.
}

var going = 0;
onkeydown = onkeyup = function(e){    
 e = e || event; // to deal with IE
 mapDown[e.keyCode] = e.type == 'keydown';
 mapUp[e.keyCode] = e.type == 'keyup';
  if(going==0){
    if(mapDown[80] && mapDown[81]) {
       going = 1;
       timer = setTimeout(runTrial, 15000);
     }; // run the function runTrial() if the keys are held down for the requisite period
  } else if(going==1){
     if (mapUp[80] || mapUp[81]) {
      going = 0;
      clearTimeout(timer);
      keyUpFunc(); // stop the timer and run the function keyUpFunc() if either of the keys are released too early
     }
  }
}

runTrial = function(){
 going = 0; //This just resets the going value for the next trial. It may not be necessary if you just store going as a local variable and reset it at the start each time. 
 console.log("all done"); // replace this with the correct function.
}