Mousetrap is a simple library for handling keyboard shortcuts in Javascript.
It is around 2kb minified and gzipped and 4.5kb minified, has no external dependencies, and has been tested in the following browsers:
- Internet Explorer 6+
- Safari
- Firefox
- Chrome
It has support for keypress, keydown, and keyup events on specific keys, keyboard combinations, or key sequences.
Getting started
Include mousetrap on your page before the closing </body> tag
<script src="/path/to/mousetrap.min.js"></script>
Add some keyboard events to listen for
<script>
// single keys
Mousetrap.bind('4', function() { console.log('4'); });
Mousetrap.bind("?", function() { console.log('show shortcuts!'); });
Mousetrap.bind('esc', function() { console.log('escape'); }, 'keyup'); // combinations
Mousetrap.bind('command+shift+k', function() { console.log('command shift k'); }); // map multiple combinations to the same callback
Mousetrap.bind(['command+k', 'ctrl+k'], function() {
console.log('command k or control k'); // return false to prevent default browser behavior
// and stop event from bubbling
return false;
}); // gmail style sequences
Mousetrap.bind('g i', function() { console.log('go to inbox'); });
Mousetrap.bind('* a', function() { console.log('select all'); }); // konami code!
Mousetrap.bind('up up down down left right left right b a enter', function() {
console.log('konami code');
});
</script>
Others
More: https://craig.is/killing/mice
Download: mousetrap-1.5.3.zip