HTML5 のキャンバス要素にフォーカスを設定するにはどうすればよいですか?

StackOverflow https://stackoverflow.com/questions/56771

  •  09-06-2019
  •  | 
  •  

質問

HTML5を使用しています <canvas> 私の iMac 上の Firefox 2.0.0.16 と Safari 3.1.2 の要素。(Windows 上の Firefox 3.0 でもこれを試しましたが、やはり無駄でした。) タグは次のようになります。

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

キャンバスと対話するいくつかの機能を「アクティブ化」するボタンがあります。そのボタンは onclick() イベントは関数を呼び出します。その関数には次の行があります。

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

これは動作しません。Firebug はエラーを報告しません。しかし、焦点は依然として元の場所にあります。キャンバスをクリックするか、キャンバスに向かってタブをクリックすると、他の要素からフォーカスが失われますが、明らかにキャンバスによってフォーカスが得られることはありません(キャンバスの onfocus() イベントは決して起動しません)。

これは奇妙だと思います。単にキャンバスにフォーカスを合わせることができないのでしょうか、それともここで何かが欠けているのでしょうか?ご洞察をいただければ幸いです。

ありがとう。

役に立ちましたか?

解決

キャンバスにタブ インデックスを付けます。

   <canvas id="display"
           width="500px"
           height="500px"
           tabindex="1">
   </canvas>
ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top