Как обнаружить CapsLock и другие не-алфавитно-цифровые специальные ключи-модификаторы в JavaScript?

Question

без использования altKey, shiftKey, ctrlKey, можно обнаружить их в том числе CapsLock, Tab и Space?

Answer 1

Вот интересный способ узнать, какой ключ был нажат в JavaScript. Это очень полезно

• Для запуска действия на основе нажатой клавиши.
• Чтобы предотвратить использование спойлера Tab, создав отступ, а не переключая фокус
• Чтобы узнать, включен ли Caps Lock. Пользователь может быть уведомлен, особенно, при заполнении полей формы.
• Используйте клавиши со стрелками для навигации и так далее.

Вот JavaScript код: -

window.addEventListener("keypress", function(e){ 
     console.log(e.keyCode); 
    }); 

    window.addEventListener("keydown", function(e){ 
     if(e.keyCode==9)  
     { 
       console.log("You Pressed Tab"); 
       e.preventDefault(); 
     } 
    }); 

    window.addEventListener("keyup", function(e){ 
     var keyPressed; 
     switch(e.keyCode) 
     { 
      case 9: return; // already handled above 
      case 18: keyPressed="Alt"; e.preventDefault(); break; 
      case 20: keyPressed="Caps Lock"; break; 
      case 17: keyPressed="Ctrl"; break; 
      case 16: keyPressed="Shift"; break; 
      case 37: keyPressed="Left A"; break; 
      case 38: keyPressed="Top A"; break; 
      case 39: keyPressed="Right A"; break; 
      case 40: keyPressed="Bottom A"; break; 
      default: keyPressed=e.keyCode; 
     } 
     console.log("You pressed "+keyPressed); 
    }); 

Причина switch case конструкция не в keydown обработчик потому, что лично мне не нравится многократное выполнение обработчика, когда клавиша удерживается нажатой. Конечно, в корпус switch можно добавить больше ключей. Также обратите внимание, что Вкладка находится под номером keydown. Это связано с тем, что Вкладка запускается при нажатии клавиши. Если бы он был помещен под keyup, обработчик keypress не был бы запущен, изменив фокус окна и рендеринг обработчика keyup бесполезен. preventDefault() предотвращает Tab и Alt от смены фокуса.
Код является просто иллюстрацией, при необходимости измените его.