how to implement shortcut key combination of CTRL or SHIFT + <letter> through javascript?

ASP.NET 2.0 web application, how to implement shortcut key combination of CTRL + Letter, preferably through JavaScript, to make web application ergonomically better? How to capture multiple-key keyboard events through JavaScript?

Answers:

Answer

The short answer is that you use Javascript to capture a keydown event and use that event to fire off a function. Relevant articles:

If you're using the jQuery library, I'd suggest you look at the HotKeys plugin for a cross-browser solution.

I know this is not answering the orginal question, but here is my advice: Don't Use Key Combination Shortcuts In A Web Application!

Why? Because it might break de the usability, instead of increasing it. While it's generally accepted that "one-key shortcut" are not used in common browsers (Opera remove it as default from its last major version), you cannot figure out what are, nor what will be, the key combination shortcuts used by various browser.

Gizmo makes a good point. There's some information about commonly-used accesskey assignments at http://www.clagnut.com/blog/193/.

If you do change the accesskeys, here are some articles with good suggestions for how to do it well:

And you may find this page of Firefox's default Keyboard and Mouse Shortcuts useful (Another version of same information). Keyboard shortcuts for Internet Explorer 7 and Internet Explorer 6. Keyboard shortcuts for Opera and Safari.

You're more likely to run into problems with JAWS or other screen readers that add more keyboard shortcuts.

Answer

Your event listener function, gets passed an Event object. That has a lot of useful information on it, including the properties "altKey", "ctrlKey", "shiftKey" and "metaKey". If any of the modifier keys are being held down when that event fires, the corresponding property is set to true.

This applies to keyboard as well as mouse events (onclick, etc). Note that if you have a onkeydown event listener, the modifier key itself will fire the event.

window.onkeyup = function(e) {
  if (e.altKey) alert("Alt pressed");
  if (e.shiftKey) alert("Shift pressed");
}

This tested on Firefox 3, Windows XP.

Answer

Javascript has support for ctrl+alt+shift keys. I assume you can figure out the rest. Link.

Answer

I know this is not answering the orginal question, but here is my advice: Don't Use Key Combination Shortcuts In A Web Application!

Why? Because it might break de the usability, instead of increasing it. While it's generally accepted that "one-key shortcut" are not used in common browsers (Opera remove it as default from its last major version), you cannot figure out what are, nor what will be, the key combination shortcuts used by various browser.

Moreover, if your visitors use a higly customisable browser, such as Firefox or Opera, There is a high risk that they have either configure their own shortcuts or use additional plug-ins that define some additional ones.

Keep in mind that web applications are browser dependend and that you should NEVER assumes that if it works on your favorite-tweak-most-powerfull-browser, it will react the same way on your friend's one.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.