[JavaScript] jQuery1.3の新機能「live events」

今年1月にjQuery1.3がリリースされてから約3ヶ月経過しました。

これまでのシステムでは jQuery1.2.6をメインとして利用していたのですが
そろそろ 1.3への移行を検討しないと・・・と考えています。

jQuery1.3の機能の中で特に目新しいのが「live events」という機能です。

live events概要

公式サイトのリリース（ http://docs.jquery.com/Release:jQuery_1.3 ）やjQuery日本語リファレンス内でも書かれているのですが、

live eventsとは、あらかじめ定義されたセレクタに対して動的に（リスナーとして）監視する設定を行い、ドキュメント全体で全てのイベント発生時にチェックします。そして、該当するエレメントが存在すれば登録したイベントを実行する機能です。

利用例

例えば、「onLoad後に JSで動的に生成されたHTML」と「静的なHTML」の中で同一クラスのエレメントが混在している場合

$('.classname').click(function(){ ... });

をonLoad時に行うと、「静的なHTML」にしかイベントが登録されません。
（onLoad後に「JSで動的に生成されたHTML」は生成されるためです。）

こういったケースで「JSで動的に生成されたHTML」にもイベントを登録させたい場合は

jQuery1.3では

$('.classname').live("click", function(){ ... });

という書き方で対応できます。

• live eventsのサンプルコードはこちらです。

関連リンク

下記のページで jQuery1.2から1.3への変更点について詳細に書かれています。

• jQuery1.3 リリース（jQuery日本語リファレンス）

※jQuery1.2.6までのjQueryをお使いの場合、livequery（jQueryプラグイン）を利用する事でも同様の効果を期待できます。

jQuery1.2.6以前の場合

上記と同じケースで jQuery1.2＋livequeryプラグインでのコードは以下になります。

$('.classname').livequery('click',function(){ ...});

livequeryの詳しい使い方はこちらです。