onkeydown événement ne fonctionne pas sur la toile?

Question

J'ai un canevas et un événement onkeydown qui lui est assigné. Lorsque une touche est enfoncée, la console est censée enregistrer le code clé de la clé. Mais il ne sort rien, même pas undefined. D'autres gestionnaires comme onclick fonctionnent bien, mais pas onkeydown. J'ai également essayé d'utiliser onkeypress et onkeyup, mais ceux-ci ne fonctionnent pas non plus. Voici le code complet:

canvas.onkeydown = function(e){ 
    if(e.keyCode === 37){ 
     ctx.clearRect(0,0,canvas.width,canvas.height); 
     ctx.drawImage(knife,knifeX - 10, knifeY); 
     knifeX -= 10; 
    } 
    else if(e.keyCode === 39){ 
     ctx.clearRect(0,0,canvas.width,canvas.height); 
     ctx.drawImage(knife,knifeX + 10, knifeY); 
     knifeX += 10;   
    } 
    else if(e.keyCode === 38){ 
     ctx.clearRect(0,0,canvas.width,canvas.height); 
     ctx.drawImage(knife,knifeX, knifeY + 10); 
     knifeY += 10; 
    } 
    else if(e.keyCode === 40){ 
     ctx.clearRect(0,0,canvas.width,canvas.height); 
     ctx.drawImage(knife,knifeX, knifeY - 10); 
     knifeY -= 10;    
    } 
    console.log(e.keyCode);  
} 

Answer 1

Au lieu de cela si vous utilisez canvas.onkeydown utiliser window.onkeydown sinon vous aurez besoin de se concentrer sur la toile pour que cela fonctionne.

window.onkeydown = function() {};

Fixation à l'élément de toile ne fonctionnera que si votre concentré dans sur cet élément. L'objet fenêtre est l'ensemble du navigateur.