Add Event Listener 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: 2020-06-24T14:23:57+05:30

742 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements