入力されたキーを受け取る（FireFox編）JavaScript入門

FireFoxでキー入力を受け付ける場合

FireFoxでキー入力を受け付ける場合、event.keyCodeが使えません。 それで、この部分を次のように変更します。

具体的には、以下のようなコードになります。

document.onkeydown = pageMove;


function pageMove(evt)
{
  if (evt.which == 66)  //「Ｂ」が押されたか確認
  {
    history.back();
  }
  if (evt.which == 70)  //「Ｆ」が押されたか確認
  {
    history.forward();
  }
}

このページのヘッダーに、上記のスクリプトを記入しています。 動くかどうか確認してください。 OperaやChrome、Safari等では動作すると思います。 しかし今度はInternet Explorerで動作しません（IE10では動作することを確認）。

では両方のブラウザで動かすにはどうしたら良いか、次に見てみることにしましょう。

両方のブラウザで動作させる

Internet ExplorerとFireFoxの両方でキー入力を受け付けるには、 以下のようにします。

<script>

document.onkeydown = pageMove;

function pageMove(evt)
{
  var kcode;  //キーコードを格納する変数
  
  //document.allはInternet Explorerでのみ使用可能
  if (document.all)  
  {
    kcode = event.keyCode;
  }
  else
  {
    kcode = evt.which;
  }
  
  if ( kcode == 66 ) { history.back(); }
  if ( kcode == 70 ) { history.forward(); }
}
    
</script>

変数kcodeを宣言して、取得したキーコードを格納するようにしています。

そしてDOM編の最初で少し触れましたが、 document.allを使って、Internet Explorerでのみ動作するスクリプトを記述します。 キーコードを取得するには、event.keyCodeでした。 取得したキーコードは変数kcodeに代入します。

else文の中（Internet Explorer以外のブラウザ）では、「引数.which」を使ってキーコードを取得し、 変数kcodeに代入しています。

あとは変数kcodeに代入された数値を調べて、戻る・進むの処理を記述しています。