A Robust Javascript Library for Capturing Keyboard Input

HotKeys.js is an input capture library with some very special features, it’s easy to capture and use, it has a reasonable footprint (about 3 KB) (compressed: 1.73 KB), and it has no dependencies. It should not interfere with any JavaScript libraries or frameworks.

How to make use of it:

Install it through NPM:

npm install hotkeys-js

Add the ‘hotkeys.js’ script to the webpage.

<script src="hotkeys.js"></script>

Basic utilization:

hotkeys('shift+a,alt+d, w', function(e){
    console.log('Do something',e);
    if(hotkeys.shift) console.log('You just clicked shift .');
    if(hotkeys.ctrl) console.log('You just clicked ctrl .');
    if(hotkeys.alt) console.log('You just clicked alt .');
});

Advanced usages.

hotkeys('a', function(event,handler){
    //event.srcElement: input 
    //event.target: input
    if(event.target === "input"){
        alert('You just pressed a!')
    }
    alert('You just pressed a!') 
});

hotkeys('ctrl+a,ctrl+b,r,f', function(event,handler){
    switch(handler.key){
        case "ctrl+a":alert('You just pressed ctrl+a!');break;
        case "ctrl+b":alert('You just pressed ctrl+b!');break;
        case "r":alert('You just pressed r!');break;
        case "f":alert(' You just pressedf!');break;
    }
});

hotkeys('ctrl+r', function(){ alert('Alert!'); return false });

hotkeys('⌘+r, ctrl+r', function(){ });

hotkeys('ctrl+a+s', function(event,handler) {
  if(handler.key === 'ctrl+a+s') {
    alert('you pressed ctrl+a+s!');
  }
});

Available choices will be passed because the second parameter to the hotkeys technique.

hotkeys('ctrl+a+s', {
  scope: 'all',
  splitKey: '+',
  element: document.getElementById('warpper'),
  keyup: true, // triggers event on keyup
  keydown: true // triggers event on down
}, function(event,handler) {
  if(handler.key === 'ctrl+a+s') {
    alert('you pressed ctrl+a+s!');
  }
});

Capture Keyboard Input, Hotkeys Plugin/Github