THE HAM MEDIA BLOG

jQueryのバージョンが1.3になって増えた新機能「live()」
いまいちよく使い方がわかっていなかったので、
勉強をかねてのメモエントリーを残しておきます。

新機能live()

詳しくないので調べてみた。

live(type, fn) - jQuery 1.3.1 日本語リファレンス

んーいまいちピンとこないのですが、
追加した要素にもイベントが登録されるというのはわかった。

普通にclick()じゃダメ？

では、通常のとliveを使った場合と
その二つを作って見比べてみることにした。

まずは通常にclickを使った場合。

■通常のclickの場合

$(".live").click(function(){
    $(this).after('<p>ここをクリックしても何もない</p>');
});

■プレビュー

見てわかると思うのですが、
最初からある部分以外でクリックしてもなにも変化ないです。
最初の部分であれば、何度クリックしても追加されるようになっていますが、
追加された部分はクリックしても何も反応しません。

live()の動作

では、liveを使ってみるとどうなるのか？

■liveを使ったclickの場合

$(".live").live('click',function(){
    $(this).after('<p class="live">ここもクリックで要素追加</p>');
});

■プレビュー

先ほどのclickのみの時と違って、追加された要素でも
クリックイベントが割り当てられている。
なので、最初の要素だけでなく追加された要素をクリックしても
どんどん追加されるようになっている。

現時点で自分のサンプルとか含めてあまり使うようなことは
ないのかもしれないですが、徐々に使い方になれていこうと思う。