HTML - Accesskey Attribute (keyboard shortcut)


All HTML elements may have the accesskey content attribute set.

The accesskey attribute's value 1) is used by the user agent as a guide for creating a keyboard shortcut that focuses (ie activates) the element.


The value must be:

  • an ordered set of unique space-separated tokens
  • that are case-sensitive,
  • each of which must be exactly one Unicode code point in length.


  • Two access key defined:
accesskey="s 0"
  • One

Assigned access key by Browsers

  • Chrome / Firefox: Alt + Shift + Key
  • Others: Alt + Key


If you want to create advanced keyboard shortcut, you can also use the keydown event (or related wrapping library)


  • A simple search box form where we want to focus on
<form id="search-form">
     <span id="search-input-container">
          <input type="search" id="search-input" placeholder="Search ..." aria-label="Search for...">
  • The javascript listen to keydown and if the control key and the key / are the one, we focus on the input
var searchInput = document.getElementById('search-input');
// window.parent because this code run in a iframe, otherwise just document
window.parent.addEventListener('keydown', function(event) {
        event.ctrlKey && event.key === '\\' && (event.preventDefault(),searchInput.focus())
  • Click Ctrl+\ to focus on the input

Powered by ComboStrap