Prototype 1.6.0 で大きく進化したイベント API (4)

Prototype 1.6.0 RC のイベント API について紹介するシリーズも今回が最後。

カスタム・イベント

あらかじめ定義された組み込みのイベント click や submit 以外にも、ユーザーが好きなイベントを発生させることができるようになった。

たとえば、こんな HTML があるとして、

<div id="container">
  <h1><span id="title">Release notes</span></h1>
  ...
</div>

Element#fire（実体は Event.fire）メソッドを使って、タイトルが変更された、という通知を送る（イベントを発生させる）ことができる。

$("title").fire("titleChanged");

当然、受け手も必要なわけで、組み込みのイベントと同様、Element#observe でコールバック関数を登録できる。

$("container").observe("titleChanged", function(event) {
  this.highlight({ duration: 0.5 });
});

ちなみに、Event.fire メソッドは内部で次のどちらかの処理を行う。

• ブラウザが DOM Events をサポートしていれば、document.createEvent でイベントを作成し、element.dispatchEvent でイベントを発生
• そうでなければ、document.createEventObject でイベントを作成し、element.fireEvent でイベントを発生

クロスブラウザな DOMContentLoaded イベント

window.onload 前でも DOM 処理が可能なら通知してくれる domready.js でも紹介した DOMContentLoaded がサポートされた。

document.observe("contentloaded", function() { ... })

従来の Element#observe メソッドを通して、透過的に扱うことができる。