JavaScript

ガイド:高橋 登史朗

Ajaxなど、何かと最近騒がれているJavaScriptの最新情報とその活用方法を解説します。

掲示板 取材依頼 問合せ

クロスブラウザを制する

掲載日: 2001年 11月 21日

クロスブラウザを制する Part 2 2-18 押されたキーコードget


★次のページに応用サンプルを用意しました。 
| →次のページ| シリーズ目次 |




*

キーボードキーを押してください。
















getKEYCODE()
Win n4 n6 moz e4 e5 e6,
Mac n4 n6 moz e4.5 e5 ,
Linux n4 n6 moz
押されたキ−コードを取得するためのファンクションです
<script language="JavaScript">
<!--


/*/////////////// 押されたキ−コード取得用関数   UseFree
========================================================
 Win  n4 n6 moz e4 e5 e6,
 Mac  n4 n6 moz e4.5 e5,
 Linux n4 n6 moz         
========================================================
 押されたキ−コードを取得します。
 キ−の文を取得したい場合は、getKEYSTR(e)を
 参照してください

 使用例  //押されたキ−コードをダイアログに表示する
  alert( getKEYCODE(e) )

 Support http://game.gr.jp/js/
=======================================================*/

  //--ブラウザを調べてNNとIEの分岐を微調整します
  MSIE = navigator.userAgent.indexOf("MSIE")!=-1 

  //--押されたキ−コードを返す
  function getKEYCODE(e){  
      if(document.all)           return  event.keyCode
      else if(document.getElementById) 
            return (e.keyCode!=0)?e.keyCode:e.charCode
      else if(document.layers)   return  e.which
  }

  //--キーeventをセットする
  document.onkeypress = key_Press
  if(document.layers)
                document.captureEvents(Event.KEYPRESS)
  self.focus()


  //--キープレス時の処理

  function key_Press(e){

    //この関数の中へキープレス時の処理を書く

    msg  = '<span                                 '
    msg += '      style="color:orange;            '
    msg += '      font-size:30px;font-weight:900">'
    msg += '押したキーの文字は : '
    msg += String.fromCharCode(getKEYCODE(e))
    msg += '<br>キーコードは : '
    msg += getKEYCODE(e)
    msg += '</span>'

     outputLAYER('outputbox',msg)

  }

/*/////////////// 押されたキ−コード取得用関数ここまで */


/*///////////////////////////// HTML出力用関数   UseFree
========================================================
 Win  n4 n6 moz e4 e5 e6,
 Mac  n4 n6 moz e4.5 e5,
 Linux n4 n6 moz         
========================================================
  使用例
  outputLAYER('レイヤ−名',出力するHTML) 

 Support http://game.gr.jp/js/
=======================================================*/

  function outputLAYER(layName,html){

    if(document.getElementById){       //N6,Moz,IE5,IE6用
      document.getElementById(layName).innerHTML=html

    } else if(document.all){                      //IE4用
      document.all(layName).innerHTML=html

    } else if(document.layers) {                  //NN4用
       with(document.layers[layName].document){
         open()
         write(html)
         close()
      }
    }

  }

/*///////////////////////////// HTML出力用関数ここまで */


//-->
</script>

<!--このレイヤ−の中へ文字を出力します-->
<div id="outputbox"
     style = " position : absolute        ;
               left : 50px ; top : 100px ;
      "></div>

* 緑文字が今回の関数
* 赤文字がこのスクリプトで最初に動作する部分
						
document.onkeypress = Function名によるonkeypress監視とセットで使い、押し下げたられたキーのコードを取得しています。 キーの文字を取得したい場合はキーコードgetを参照。


★次のページに応用サンプルを用意しました。 
| →次のページ| シリーズ目次 |


ガイドメールマガジン
携帯電話のメールアドレスでは登録できません

掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます。