Glowでイベントリスナを登録する場合は、glow.events.addListenerを使用する。

glow.events.addListener(attachTo, name, callback, context);

それぞれの引数に渡す情報は次のとおり。

  • attachTo … イベントリスナを設定するオブジェクトを指定
  • name … イベントのタイプを指定
  • callback … イベント発生時に実行する関数を指定
  • context … コールバックスコープを指定

glow.events.addListenerを使用し、ボタンをクリックするとアラートを表示するサンプルを作ってみよう。

addListener.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
    <head>
        <title>Hello, Glow! / glow.events.addListener()</title>
        <script type="text/javascript" src="./glow/1.5.1/core/core.js"></script>
        <script type="text/javascript">
        <!--
        glow.ready
        (
           function()
           {
               glow.events.addListener
               (
                   '#dipslayAlert', 'click',
                   function()
                   {
                       alert('click!');
                   }
               );
           }
        );
        -->
        </script>
    </head>

    <body>
        <input type="button" id="dipslayAlert" value="dipslayAlert">
    </body>
</html>

glow.events.addListener()でid="dipslayAlert"をもつボタンのクリックイベント発生時にアラートを表示する無名関数を指定した。これをWebブラウザで表示/実行する。

ボタンをクリックするとアラートが表示される

glow.events.addListnerで登録したイベントリスナはglow.events.removeListenerで削除する。このほかいくつかのメソッドの使い方については、BBC - Glow Documentations - glow.eventsを参照されたい。