addEventListener สำหรับ Keydown บน HTML5 Canvas

Canvas ต้องมี tabindex เพื่อรับ Focus และ Keyboard Events

var myTarget, myCanvas;
window.onload = function() {
    myCanvas = document.getElementById('canvas');
    // ต้องตั้ง tabindex เพื่อให้ canvas รับ focus ได้
    myCanvas.tabIndex = 0;
    myCanvas.focus();

    document.addEventListener('mousedown', function(event) {
        myTarget = event.target;
        alert('This is mousedown event.');
    }, false);

    document.addEventListener('keydown', function(event) {
        if (myTarget == myCanvas) {
            alert('This is keydown event.');
        }
    }, false);
};

สำคัญ: ต้องตั้ง tabindex="0" (หรือค่าใดก็ได้) บน <canvas> และเรียก focus() จะได้รับ keydown events