jquery - .append() クラス付き

Question

.append()テーブルに新しい行を追加するために使用したい。ただし、class="addRowDemo3"とclass="removeRowDemo3"は付加されません。理由のアイデアはありますか？

$('.addRowDemo3').click(function(){
    $('#Demo3 > tbody:last').append('<tr><td>Google</td><td>12.3</td><td>14.5</td><td>17.3</td><td>20.2</td><td><button class="addRowDemo3">Add a row</button><button class="removeRowDemo3">Remove a row</button></td></tr>');
});

score 5 · Accepted Answer

正しいクラスの行を追加および削除するボタンを追加する必要があります。ただし、イベントは新しい要素にバインドされていません。

$('selector').click(function(){}) を使用すると、DOM で現在使用可能で、セレクターによって一致する要素のみがイベントハンドラーにバインドされます。

将来の要素については、jQuery "on" を使用してみてください。

これを試して

$('#Demo3').on('click', '.addRowDemo3', function(){
    $('#Demo3 > tbody:last').append('<tr><td>Google</td><td>12.3</td><td>14.5</td><td>17.3</td><td>20.2</td><td><button class="addRowDemo3">Add a row</button><button class="removeRowDemo3">Remove a row</button></td></tr>');
});

このようにして、イベントを「#Demo3」に委譲します。「.addRowDemo3」をクリックするたびに、新しく追加されたか既存のものかを問わず、イベントが「#Demo3」までバブルし、関数が実行されます

参照: http://api.jquery.com/on/