技 巧 鍵 盤 ─ KeyNavi:キーボードを活用してホームページを快適に─    
キー割当表示[Shift-H]        
ホーム KeyNavi対応方法 [0] JavaScript@Keynavi.Netトップ [1] キーやマウスが押されたことを確認したい ・サイトマップ [Shift-S]

■ キーやマウスが押されたことを確認したい

キーが押された時には3つのイベントが発生します。 まずキーが押された瞬間に「keydown」 押している間に「keypress」 キーから指を離しキーが上がる瞬間に「keyup」です。

マウスについては 同様に「mousedown」「mouseup」があります。

単にキーやマウスが押されたことを確認するには 「keydown」「mousedown」を使うのがいいでしょう。

自動ナビ「T/G」はキーやマウスが押されると停止しますが この方法をカラクリとして使っています。

【キーやマウスが押されたことを確認するサンプル:Copy&Paste】

<script language="javascript" src="http://www.keynavi.net/files/keynavi_ja.js"></script>
<script language="javascript"><!--

function kl_onkeydown_ex(e){
        alert("キーが押されました。");
}
function kl_onmousedown_ex(e){
        alert("マウスボタンが押されました。");
}
//-->
</script>

上のコードを見ると 「kl_onkeydown_ex(e)」「kl_onmousedown_ex(e)」という見慣れない関数が 定義されています。 これはKeyNavi拡張用関数です。 KeyNaviでは 該当名の関数が定義されていると 「keydown」「mousedown」イベントが発生するときに自動で呼び出してくれます。

他には「kl_onkeypress_ex」「kl_onkeyup_ex」「kl_onload_ex」が利用可能です。

この方法は以下の点で便利です。

関数を定義するのみでOK。イベントハンドラの登録が不要。
面倒なブラウザ分岐処理が不要。1つの命令文でOK。
「document.onxxx=...」とする場合と異なり、 既存ハンドラの上書きを心配する必要が無い。
IE4+,Opera6+ではイベント引数「e」が「undefined」になるが
「event」オブジェクトが代入されてくるので「e」をそのまま利用できる。

mousedown,keydown以外の関数については次項 その他の一般拡張用関数 (「キーイベント処理の工夫 」内) を参照。

注: 終わりの方に「self["func"]=func」という記述がありますが通常は不要です。 これは名前空間対策で これが無いと「func」が未定義扱いになります。 この実行フォームのように「eval("スクリプト...")」を実行する場合にのみ 追記します。




【JavaScript@Keynavi.Net : キーイベント処理編 】
「Ctrl-矢印」でフォーカスを上下左右に移動できます。

  - キーやマウスが押されたことを確認したい
  - キーイベント処理の工夫

トップへ戻る [1]
ホーム KeyNavi対応方法 [0] JavaScript@Keynavi.Netトップ [1] キーやマウスが押されたことを確認したい ・サイトマップ [Shift-S]
キー割当表示[Shift-H] ─ KeyNavi Project 2003 ─