Comment définir le focus sur l'élément canvas HTML5?

Question

J'utilise l'élément HTML5 <canvas> dans Firefox 2.0.0.16 et dans Safari 3.1.2, les deux sur mon iMac. (Je l'ai essayé dans Firefox 3.0 sur Windows et, également sans résultat.) La balise ressemble à ceci:

<td> 
    <canvas id="display" 
      width="500px" 
      height="500px"> 
    </canvas> 
</td> 

J'ai un bouton pour « activer » certaines fonctionnalités qui interagit avec la toile. L'événement onclick() de ce bouton appelle une fonction. Dans cette fonction, j'ai la ligne suivante:

document.getElementById("display").focus(); 

Cela ne fonctionne pas. Firebug ne signale aucune erreur. Mais l'accent reste encore là où il était. Je peux cliquer sur la toile ou l'onglet vers la toile et le focus sera perdu des autres éléments, mais apparemment ne sera jamais gagné par la toile (l'événement onfocus() de la toile ne se déclenche jamais).

Je trouve cela étrange. Est-ce que la toile ne peut tout simplement pas être mise au point, ou est-ce qu'il me manque quelque chose ici? Toute idée serait appréciée.

Merci.

Answer 1

Donnez la toile un index de tabulation:

<canvas id="display" 
      width="500px" 
      height="500px" 
      tabindex="1"> 
    </canvas>