HAM MEDIA MEMO

jQuery の .live() の代わりは .on()

.live() の代わりは .on()

.live() が使えた頃は、下記のような書き方だった

$('selector').live('click', function () {
  // クリックした時の処理
});

しかし、 .on() になってからは記述方法が変わっている。

$(document).on('click', 'selector', function () {
  // クリックした時の処理
});

ちなみに、 .on() で .live() の振る舞いをさせて見た時のサンプルは下記のようになる。 下のサンプルでは、クリックすると要素が追加され、その追加した要素でもクリックをすると同じように要素が追加される動作をする。 .click() などでイベントを最初につけるだけでは、追加された要素では動かないが、この記述にすることで、追加された要素でもイベントが発生する。

.on() で .live() の振る舞いをするサンプル

JavaScript

$(document).on('click', '.addButton', function () {
  $(this).after('<button class="addButton">クリックで要素追加</button>');
});

サンプル