author: Krasimir Tsonev

Krasimir is a blogger, who writes and speaks.
He loves open source and codes awesome stuff.

Javascript: handling keyboard shortcuts with jQuery

Last few years the JavaScript frameworks are big part of our web sites. I strongly recommend the usage of tools like jQuery or MooTools, because they will save you a lot of time and problems. These days I needed to create a keyboard shortcut for one of the projects that I'm working on. I wanted to catch the Ctrl+Shift+F9 combination. It was just a few lines of code and I decided to share it with you.

// defining flagsvar isCtrl = false;var isShift = false;// helpful function that outputs to the containerfunction log(str) {	$("#container").html($("#container").html() + str + "");};// the magic :)$(document).ready(function() {	log("Ready. Press Ctrl+Shift+F9!");		// action on key up	$(document).keyup(function(e) {		if(e.which == 17) {			isCtrl = false;		}		if(e.which == 16) {			isShift = false;		}	});	// action on key down	$(document).keydown(function(e) {		if(e.which == 17) {			isCtrl = true; 		}		if(e.which == 16) {			isShift = true; 		}		if(e.which == 120 && isCtrl && isShift) { 			log("------- catching Ctrl+Shift+F9");		} 	});	});
Check the live example here.

blog comments powered by Disqus