javascript - 置き換えられるオブジェクトのjquery変更ハンドラ

Question

オブジェクトが置き換えられた後にチェックされている場合、オブジェクトをチェックし続ける方法はありますか

これは私が抱えている問題を示しています

http://jsfiddle.net/nr6eA/

要素が置き換えられると、変更機能が再度トリガーされることはありませんが、これが起こっている理由はよくわかりますが、これを解決する方法がわかりません。

チェックボックスがたくさんありますが、それらを置き換えるときにそれぞれにスクリプトを追加するのは最善の考えではないようです。

ajaxの更新後にjquery関数を再初期化する方法はありますか?

Answer 1

イベント委任が必要です。その目的のために、on()以下のように jQuery 1.7+ で使用できます。

の場合.on():

$(document).ready(function() {
    $('#f').on('change', ' input:checkbox', function() {
        $('#textbox1').val($(this).attr('id') + " " + $(this).is(':checked'));
        $(this).replaceWith('<input type="checkbox" id="checkbox1" class="ichange"/>')
    });
});​

しかし、あなたのフィドルショーはjQuery 1.6.2. その場合、live()またはを使用できますdelegate()。

の場合live():

$(document).ready(function() {
    $('#f input:checkbox').live('change', function() {
        $('#textbox1').val($(this).attr('id') + " " + $(this).is(':checked'));
        $(this).replaceWith('<input type="checkbox" id="checkbox1" class="ichange"/>')
    });
});​

そしてのためにdelegate()：

$(document).ready(function() {
    $('#f').delegate('input:checkbox', 'change', function() {
        $('#textbox1').val($(this).attr('id') + " " + $(this).is(':checked'));
        $(this).replaceWith('<input type="checkbox" id="checkbox1" class="ichange"/>')
    });
});​

.on()ただし、jQuery 1.7+ で使用できるとより良いでしょう。