プロトタイプ-イベント処理

イベント管理は、クロスブラウザスクリプティングを達成するための最大の課題の1つです。すべてのブラウザには、キーストロークを処理するさまざまなアプローチがあります。

Prototype Frameworkは、すべてのブラウザー間互換性の問題を処理し、イベント管理に関連するすべてのトラブルから解放します。

Prototype Frameworkは_Event_名前空間を提供します。この名前空間にはメソッドが豊富で、すべてが現在のイベントオブジェクトを引数として取り、すべての主要なブラウザーで要求する情報を喜んで生成します。

イベント名前空間は、キーボード関連のイベントで使用できるキーコードの標準化されたリストも提供します。次の定数は、名前空間で定義されています-

S.No.	Key Constant & Description
1.	KEY_BACKSPACE バックスペースキーを表します。
2.	KEY_TAB タブキーを表します。
3.	KEY_RETURN リターンキーを表します。
4.	KEY_ESC ESCキーを表します。
5.	KEY_LEFT 左キーを表します。
6.	KEY_UP キーを表します。
7.	KEY_RIGHT 正しいキーを表します。
8.	KEY_DOWN ダウンキーを表します。
9.	KEY_DELETE 削除キーを表します。
10.	KEY_HOME ホームキーを表します。
11.	KEY_END 終了キーを表します。
12.	KEY_PAGEUP ページアップキーを表します。
13.	KEY_PAGEDOWN ページダウンキーを表します。

イベントを処理する方法

開始する前に、イベントメソッドの使用例を見てみましょう。この例は、イベントが発生したDOM要素をキャプチャする方法を示しています。

例

<html>
   <head>
      <title>Prototype examples</title>
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>

      <script>
        //Register event 'click' and associated call back.
         Event.observe(document, 'click', respondToClick);

        //Callback function to handle the event.
         function respondToClick(event) {
            var element = event.element();
            alert("Tag Name : " + element.tagName );
         }
      </script>
   </head>

   <body>
      <p id = "note"> Click on any part to see the result.</p>
      <p id = "para">This is paragraph</p>
      <div id = "division">This is divsion.</div>
   </body>
</html>

出力

以下は、*イベント*に関連するすべてのメソッドの完全なリストです。頻繁に使用する可能性が最も高い関数は、observe _、 element_、および_stop_です。

プロトタイプイベントメソッド

注-少なくともprototype.jsのバージョン1.6を使用していることを確認してください。

S.No.	Method & Description
1.	element() イベントが発生したDOM要素を返します。
2.	extend() _event_を、Event.Methodsに含まれるすべてのメソッドで拡張します。
3.	findElement() イベントが発生したタグ名から、指定されたタグ名を持つ最初のDOM要素を返します。
4.	isLeftClick() ボタン関連のマウスイベントが「左」（実際にはプライマリ）ボタンに関するものであったかどうかを判断します。
5.	observe() DOM要素にイベントハンドラーを登録します。
6.	pointerX() マウスイベントの絶対水平位置を返します。
7.	pointerY() マウスイベントの絶対垂直位置を返します。
8.	stop() イベントの伝播を停止し、デフォルトのアクションが最終的にトリガーされるのを防ぎます。
9.	stopObserving() イベントハンドラーの登録を解除します。
10.	unloadCache() observeを通じて登録されたすべてのイベントハンドラーを登録解除します。自動的に配線されます。 1.6以降では使用できません。

Prototype-event-handling

目次

プロトタイプ-イベント処理

イベントを処理する方法

例

出力

プロトタイプイベントメソッド