Home » March 2005 » Accesskeyを修飾するJavaScript

Accesskeyを修飾するJavaScript

Accesskeyを修飾するためのJavaScriptを作りました。JavaScriptで試しにOOPしてみたかっただけです。

accesskey.js

<label accesskey="k">Access Key</label>

のようなLABEL要素があるときに

<label accesskey="k">Access <em>K</em>ey</label>

のように書き換えます。使い方はHTMLファイルの末尾の方(</body>よりは前)に以下のように追加するだけです。

<script type="text/javascript" src=".../accesskey.js"></script>

仕様

大まかな振る舞いは上に書いた通りですが、正確には以下のような振る舞いをします。

  1. LABEL要素の子要素でaccesskeyの大文字とマッチするものがあれば、その最初のものを修飾します。
  2. もしなければ、LABEL要素の子要素でaccesskeyの小文字とマッチするものがあれば、その最初のものを修飾します。
  3. それもなければ、子要素に「 (K)」(Kはaccesskey)という文字列を付加し、その「K」を修飾します。

カスタマイズ

スクリプトの末尾の部分を以下のように書き換えると、<em>...</em>の代わりに、<strong>...</strong>や<span class="accesskey">...</span>で修飾することができます。

modifyAccessKey();
modifyAccessKey('strong');
modifyAccessKey('span', 'accesskey');

また、LABEL要素以外を修飾の対象としたい場合には、modifyAccessKeyという関数の定義を変更することで対応できます。特にA要素のaccesskeyを明示したい向きはあるでしょう。そのうち修正例を示すかもしれません。

Comments and Trackbacks

Legacy Comments (2)

  1. こんにちは。
    あ、コレ凄くいいですね。欲しかった機能でした。
    ぜひ有効利用させて戴きます。

    惜しむべきはCCL(by-nc-nd)上、仕事で使えない事くらいです(笑)。

  2. accesskey.js内にちょっと書いておきました。このスクリプト自体は利用・改造・配布自由、商用利用も自由ということでひとつ。もっと凝ったものをきっと誰か作っているに違いありませんけどね。

    ただアクセシビリティ的にはどうなんでしょう。