動的に作成されたボタンが正しく動作しない

Question

jqueryでテーブルの行を動的に作成し、各行に削除ボタンを追加し、そのボタンに対応する行（行内）が削除されるイベントをこのボタンに追加します私がそのボタンをクリックすると、私の虫は上の3つのボタンだけがアクティブであり、解雇され、最後にはボタンが機能しません。

$(function(){ 
    $('<input></input>') 
     .attr({'type': 'button'}) 
     .val("Remove") 
     .appendTo('table#AllSelectedTest tbody tr:first td:last') 
    ; 
}); 

$(document).ready(function() { 
    $("table#AllSelectedTest tbody tr input").live({ 
     click: function(){ 
      $(this).closest('tr').remove(); 
     } 
    }) 
}); 

私は上記のコードを使用します。ボタンを生成し、それをイベントにバインドします。私の問題は、いくつかのボタンの作品であり、いくつかは、あなたのコードを見ることなく

Answer 1

でその要素にIDを与えるために、常に良いです。フィドル例

$(document).ready(function(){ 
    $('<input>').attr({type: 'button', id:"remove_button", value:'Remove'}) 
        .appendTo('table#AllSelectedTest tbody tr:first td:last'); 

    $("#remove_button").live("click", function(){ 
         $(this).closest('tr').remove(); 
     }); 
}); 

以下のようにコードを変更してみてください：あなたが1.7を超えるjqueryのを使用している場合 http://jsfiddle.net/vSUYj/1/

また、代わりにliveの使用onしてください。

更新：

$(document).ready(function(){ 
     var elem = $('table#AllSelectedTest tbody tr:first td:last'); 
     elem.append('<input type="button" id="remove_button" value="Remove"/>'); 

    $("#remove_button").live("click", function(){ 
     $(this).closest('tr').remove(); 
    }); 
}); 

フィドル例を働いていない上記の場合には、同様にこれを試してみてください。http://jsfiddle.net/vSUYj/

Answer 2

ではありません 、それは確かに言うことは不可能ですが、あなたはこれらのボタンのハンドラを割り当てることが.live()や.delegate()を使用していますか？

編集：また、これらのメソッドは、jQueryの最新バージョンでは廃止されましたことに留意すべきである、と新しい方法が.on()