addEventListener for keydown on HTML5 Canvas


Use the tabindex attribute on the canvas element for addEventListener on Canvas −

var myTarget, myCanvas;

window.onload = function() {
   myCanvas = document.getElementById('canvas');
   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);
}

Updated on: 24-Jun-2020

499 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements