Appendix JS_C_A1

Summary

Requirement: All functionality is operable through a keyboard interface.

Details: Interactive content should be accessible to the keyboard, using common keystrokes like ‘Tab’, ‘Enter’ and Arrow Keys.

Examples

Correct code

Refer to the JS_C_A1 live demo for a working example.

<p>
    <input id="demo" type="text" />
</p>
var data = document.getElementById('demo');
 
var keymap = 
{ 
    9 : 'Tab', 
    13 : 'Enter/Return',
    27 : 'Escape',
    37 : 'Left-Arrow',
    38 : 'Up-Arrow', 
    39 : 'Right-Arrow', 
    40 : 'Down-Arrow'
};
 
data.addEventListener('keydown', function(e)
{
    if(typeof(keymap[e.keyCode]) != 'undefined')        
    {
        data.value = keymap[e.keyCode] 
                   + ' Key = ' + e.keyCode;
 
        if(e.keyCode != 9)
        {
            e.preventDefault();
        }
    }
}, false);