accesskey属性

ブラウザは、ショートカットキーが使えますが、ページ独自のショートカットキーも使えます。

本ページでは、グローバル属性のaccesskeyについて説明します。

accesskeyとは

accesskeyは、ショートカットキーを設定します。グローバル属性のため、すべてのHTML要素で使えます。

ショートカットキーとは、マウスを使ってクリックする代わりに、1つ、または複数のキーを同時に押すことで代替えするものです。

ブラウザには、デフォルトでショートカットキーが登録されていています。例えば、「Ctrl」+「+」を同時に押すと、ページをズームイン(拡大表示)します。これは、どのWebページを見ていても使えます。

accesskeyで設定するショートカットキーはページ独自のため、そのページだけで使えます。

以下は、accesskeyで設定したキーでショーットカットする時に、同時に押すキーをブラウザごとに示しています。

例えば、accesskeyをcに設定した場合、WindowsのFirefoxでは「Alt」 + 「Shift」 + 「c」がショートカットキーになります。

accesskeyの利用例は、以下のとおりです。

【accesskey利用例(a要素)】

<a href="test.html" accesskey="c">テスト</a>

WindowsのFirefoxなどで「Alt」+「Shift」+「c」を同時に押すと、クリックしたのと同様にリンク先へ移動します。また、Macでは「Control」 + 「Option」 + 「c」になります。

もう1つの例です。

【accesskey利用例(input要素)】

<input type="text" name="test" accesskey="d">

ショートカットキーを使うと、入力欄がフォーカス(入力状態になる)されます。

以下は、input要素を使った実行例です。

Windowsのブラウザでは、「Atl」+「Shift」+「d」を同時に押すと、フォーカスされることが多いと思います。また、Macでは「Control」 + 「Option」 + 「d」になります。

なお、ショートカットキーが使えることは、補足などで説明しておく必要があります。

各ブラウザの最新バージョンでのサポート状況は、以下のとおりです。

【パソコン】
項目	IE	Ed	Fx	Ch	Sa	Op
accesskey	〇	〇	〇	〇	〇	〇

【スマートフォン】
項目	Sa	An	Op	Ch	Fx	Sm
accesskey	〇	〇	〇	〇	〇	〇

※スマートフォンのFirefoxとChromeは、Android版です。