In this experiment, the conflict of double and triple key combination is investigated (for example, alt+t and alt+shift+t ). According to the plan, when you press alt+t , the color of the left square should change, and when you press alt+shift+t , the right one. However, the alt+t combination prevents alt+shift+t alt+t from triggering, even with the correct keystroke sequence:

(For some reason, nothing works in snippet at all, but in JSFiddle it will work after clicking on the result field. This is because floating frames are used)

 let $leftRect = $('.rec1'); let $rightRect = $('.rec2'); $leftBtn.on('mousedown', function(){ $leftRect.css('background', 'DarkCyan'); }); $leftBtn.on('mouseup', function(){ $leftRect.css('background', '#ff6666'); }); document.onkeydown = function(e){ if (e.altKey && e.keyCode === 84) { // T $leftRect.css('background', 'DarkCyan'); } else if (e.altKey && e.shiftKey && e.keyCode === 84) { // T $rightRect.css('background', 'DarkCyan'); } }; 
 .rec1{ display: inline-block; width: 100px; height: 100px; background:#ff6666; } .rec2{ display: inline-block; width: 100px; height: 100px; background:#ff6666; } 
 <div class="rec1"></div> <div class="rec2"></div>

How to remove this conflict?

The solution to "swap if and else if places" (if it works at all) does not fit: it is assumed that in practice the key combinations will be repeatedly redefined, therefore there should be no hard sequence.

    1 answer 1

    You have a problem in that you for some reason reject the right solution from the threshold.
    It is to swap places and nothing else. You must first check the triple clicks (in any order), and then double (in any order). The check must be framed by simple if blocks (without the sausage else if ).
    Each if must include a return after executing the necessary code.

     document.onkeydown = function(e){ if (e.altKey && e.shiftKey && e.keyCode === 84) { // T $rightRect.css('background', 'DarkCyan'); return; } // еще тройные блоки... if (e.altKey && e.keyCode === 84) { // T $leftRect.css('background', 'DarkCyan'); return; } // еще двойные блоки... };