How can I add a JavaScript keyboard shortcut to an existing JavaScript Function?

An event handler for the document's keyup event seems like an appropriate solution.

An event handler for the document's keyup event seems like an appropriate solution // define a handler function doc_keyUp(e) { // this would test for whichever key is 40 and the ctrl key at the same time if (e. CtrlKey && e. KeyCode == 40) { // call your function to do the thing pauseSound(); } } // register the handler document.

AddEventListener('keyup', doc_keyUp, false).

This works very well, thank you. How could I use this code twice because I need another shortcut key for 'playSound()'? – Chris Mar 24 '10 at 21:38 add an else-if statement similar to the first if statement, but change the keycode as necessary.

Make your playSound() call from there. If you want to use the same key for both activities, you'll have to set up a flag variable and check/set it whenever the key is pushed to determine which action to take. – lincolnk Mar 24 '10 at 22:01 And what about those browsers that don't support addEventListener?

– 999 Mar 24 '10 at 22:34 IE is the only one i've worked with that doesn't, and you would use document. AttachEvent('onkeyup', doc_keyUp); there should be lots of references around to these about checking if a function exists before calling it. – lincolnk Mar 24 '10 at 23:02 I tried to add an else-if but it doesn't work, please refer to the topic post to see the updated code.

– Chris Mar 25 '10 at 0:15.

Catch the key code and then call your function. This example catches the ESC key and calls your function. Function getKey(key){ if ( key == null ) { keycode = event.

KeyCode; // To Mozilla } else { keycode = key. KeyCode; } // Return the key in lower case form if (keycode ==27){ //alert(keycode); pauseSound(); return false; } //return String. FromCharCode(keycode).toLowerCase(); } $(document).

Ready( function (){ $(document). Keydown(function (eventObj){ //alert("Keydown: The key is: "+getKey(eventObj)); getKey(eventObj); }); }); You'll need JQUERY for this example.

Here's some stuff to use if you want. You can register a bunch of keys and handler with it. Comments are in the code, but I short it goes like this: It sets up a listener on the document and manages a hash with the key combinations for which you want to listen.

* When you register a key (combination) to listen for, you submit the keycode (preferrably as a constant taken from the exported "key" property, to which you can add more constants for yourself), a handler function and possibly an options hash where you say if the ctrl and/or alt key are involved in your plans for this key. * When you de-register a key (combination) you just submit the key and the optional hash for ctrl/alt-ness. Window.

Npup = (function keypressListener() { // Object to hold keyCode/handler mappings var mappings = {}; // Default options for additional meta keys var defaultOptions = {ctrl:false, alt:false}; // Flag for if we're running checks or not var active = false; // The function that gets called on keyup. // Tries to find a handler to execute function driver(event) { var keyCode = event. KeyCode, ctrl =!event.

CtrlKey, alt =!event. AltKey; var key = buildKey(keyCode, ctrl, alt); var handler = mappingskey; if (handler) {handler(event);} } // Take the three props and make a string to use as key in the hash function buildKey(keyCode, ctrl, alt) {return (keyCode+'_'+ctrl+'_'+alt);} function listen(keyCode, handler, options) { // Build default options if there are none submitted options = options || defaultOptions; if (typeof handler! =='function') {throw new Error('Submit a handler for keyCode #'+keyCode+'(ctrl:'+!options.

Ctrl+', alt:'+options. Alt+')');} // Build a key and map handler for the key combination var key = buildKey(keyCode,!options. Ctrl,!options.

Alt); mappingskey = handler; } function unListen(keyCode, options) { // Build default options if there are none submitted options = options || defaultOptions; // Build a key and map handler for the key combination var key = buildKey(keyCode,!options. Ctrl,!options. Alt); // Delete what was found delete mappingskey; } // Rudimentary attempt att cross-browser-ness var xb = { addEventListener: function (element, eventName, handler) { if (element.

AttachEvent) {element. AttachEvent('on'+eventName, handler);} else {element. AddEventListener(eventName, handler, false);} } , removeEventListener: function (element, eventName, handler) { if (element.

AttachEvent) {element. DetachEvent('on'+eventName, handler);} else {element. RemoveEventListener(eventName, handler, false);} } }; function setActive(activate) { activate = (typeof activate==='undefined' ||!

Activate); // true is default if (activate===active) {return;} // already in the desired state, do nothing var addOrRemove = activate? 'addEventListener' : 'removeEventListener'; xbaddOrRemove(document, 'keyup', driver); active = activate; } // Activate on load setActive(); // export API return { // Add/replace handler for a keycode. // Submit keycode, handler function and an optional hash with booleans for properties 'ctrl' and 'alt' listen: listen // Remove handler for a keycode // Submit keycode and an optional hash with booleans for properties 'ctrl' and 'alt' , unListen: unListen // Turn on or off the whole thing.

// Submit a boolean. No arg means true , setActive: setActive // Keycode constants, fill in your own here , key : { VK_F1 : 112 , VK_F2: 113 , VK_A: 65 , VK_B: 66 , VK_C: 67 } }; })(); // Small demo of listen and unListen // Usage: // listen(key, handler ,options) // unListen(key, ,options) npup. Listen(npup.key.

VK_F1, function (event) { console. Log('F1, adding listener on \'B\''); npup. Listen(npup.key.

VK_B, function (event) { console. Log('B'); }); }); npup. Listen(npup.key.

VK_F2, function (event) { console. Log('F2, removing listener on \'B\''); npup. UnListen(npup.key.

VK_B); }); npup. Listen(npup.key. VK_A, function (event) { console.

Log('ctrl-A'); }, {ctrl: true}); npup. Listen(npup.key. VK_A, function (event) { console.

Log('ctrl-alt-A'); }, {ctrl: true, alt: true}); npup. Listen(npup.key. VK_C, function (event) { console.

Log('ctrl-alt-C => It all ends! '); npup. SetActive(false); }, {ctrl: true, alt: true}); It is not terribly tested, but seemed to work OK.

Look at http://www.cambiaresearch.com/c4/702b8cd1-e5b0-42e6-83ac-25f0306e3e25/Javascript-Char-Codes-Key-Codes.aspx to find a lot of keyCodes to use.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions