Javascriptのイベント追加

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>イベントサンプル</title>
    <script language="javascript" type="text/javascript">
    function popUp(e){
      var text = document.getElementById('t1');
      var lower_text = text.value.toUpperCase();
      text.value = lower_text;
    }
    function setListeners(e){
      var text = document.getElementById('t1');
      addListener(text,'keyup',popUp,false);
    }
    function addListener(elem, eventType, func, cap){
      if(elem.addEventListener){
        elem.addEventListener(eventType,func,cap);
      } else if(elem.attachEvent){
        elem.attachEvent('on'+eventType,func);
      } else {
        alert('ご利用のブラウザは対応していません!');
        return false;
      }
    }
    addListener(window,'load',setListeners,false);
    </script>
  </head>
  <body>
    <input type="text" name="t1" id="t1" />
  </body>
</html>

キーボードを押した時に文字を取得して、toUpperCaseをしている。

実際の処理は、windowのloadイベントにaddListenerを実行

addListener(window,'load',setListeners,false);

addListenerでは、FirefoxIE用に分けてイベントを追加している。