2014年4月3日木曜日

jQuery:ページ表示後に追加された要素へのイベントバインド

jQuery でイベントをバインドするときに以下のように書いていたとする。
$('.target_class').on('click', function() {
    alert('target_class がクリックされました');
});

この場合、以下のように新しくページヘ追加された要素は反応しない。
$('body').append($('<button class="target_class">押してね</button>'));

ページに新しく追加された要素も含めてイベントをバインドしたいときは、
以下のように doument へバインドする。
$(document).on('click', '.target_class', function() {
    alert('target_class がクリックされました');
})


0 件のコメント:

コメントを投稿