如何在onkeyup后恢复onkeydown的重复触发功能？

这个问题的核心是你依赖了浏览器原生的keydown重复触发机制，而当组合键松开其中一个后，浏览器的事件触发逻辑可能“卡壳”，没法立刻恢复单键的重复输出。咱们换个思路，不用等浏览器主动发keydown事件，而是自己主动轮询按键状态，完全掌控触发频率，就不会出现这种问题了。

修改后的代码实现 #

var map = {};
var keyCheckInterval = null;

// 先搞定按键状态的记录逻辑
document.onkeydown = document.onkeyup = function(e){
    e = e || window.event;
    map[e.keyCode] = e.type === 'keydown';
    
    // 控制定时器的启停：有按键按下就启动，全松开就停止
    const anyKeyPressed = Object.values(map).some(pressed => pressed);
    if (anyKeyPressed && !keyCheckInterval) {
        // 这里的100ms是触发间隔，你可以根据需求调整，越小越灵敏
        keyCheckInterval = setInterval(checkActiveKeys, 100);
    } else if (!anyKeyPressed && keyCheckInterval) {
        clearInterval(keyCheckInterval);
        keyCheckInterval = null;
    }
};

// 专门负责检测按键状态并输出的函数
function checkActiveKeys() {
    if(map[38] && map[37]){ 
        console.log('Up Left'); 
    } else if(map[38] && map[39]){ 
        console.log('Up Right'); 
    } else if(map[38]){ 
        console.log('Up'); 
    } else if(map[40]){ 
        console.log('Down'); 
    } else if(map[37]){ 
        console.log('Left'); 
    } else if(map[39]){ 
        console.log('Right'); 
    }
}

// 页面关闭时记得清理定时器，避免内存泄漏
window.addEventListener('beforeunload', () => {
    if (keyCheckInterval) clearInterval(keyCheckInterval);
});

为什么这个方案能解决问题？ #

• 摆脱浏览器事件依赖：原来的代码只有在keydown或keyup事件触发时才会判断输出，而浏览器的重复keydown触发有系统级的延迟，且组合键切换时可能出现事件中断。现在用定时器主动轮询，只要按键按着，就会持续输出。
• 灵活控制触发频率：你可以修改setInterval的时间参数（比如改成50ms），让输出更灵敏，或者调大数值减少输出频率。
• 资源自动清理：当所有按键都松开时，定时器会自动停止，不会浪费浏览器资源。

原代码的问题出在哪？ #

原来的逻辑是在按键状态变化的瞬间（keydown/keyup触发时）执行一次判断。当你按住上键+左键时，浏览器会重复触发上键的keydown，所以能持续输出Up Left；但松开左键后，只有keyup事件触发时会执行一次判断输出Up，之后浏览器可能没有继续触发上键的重复keydown事件，自然就不会再输出了。

内容的提问来源于stack exchange，提问作者AlgoDan