追加されたHTMLを持つ要素からjQueryの値を取得

Question

ファイルをアップロードするためのドラッグアンドドロップライブラリをテーブルに追加しています。しかし、ファイルが削除されると、このファイルの名前と説明を作成する必要があります。しかし、誰かが名前を書いたときに、テキストボックスから要素を取得することはできません。

これはコードと私の試みです。あなたは、私が後にHTMLを書くことから値を取得できますか

（場合に多くのファイルがある）私は、テーブルを追加するとき、私はfile-upload-title入力テキストオブジェクトの一意のIDを使用して見ることができます

$.each(data.files, function (index, file) { 
     $('#TestTable > tbody:last-child').append('<tr><td>' + file.name + '</td><td><input id="file-upload-title' + file.name + '" type="text"></td></tr>'); 

      data.context = $('<button/>').text('Upload') 
      .addClass("btn btn-primary start") 
      .appendTo('#TestTable > tbody:last-child') 
      .click(function() { 
        // This is the problem 
        alert($('#file-upload-title' + file.name).val()); = undefined 
      }); 

     }); 

ドキュメントが読み込まれましたか？

編集

$('#file-upload-title' + file.name)なくval()

おかげ

Answer 1

代わりに一緒にあなたがイベントを発生させた要素を参照するためにthisキーワードを使用することができますセレクタをハッキングのためのオブジェクトの存在があります。そこからDOMトラバーサルメソッドを使用して、関連するinputを見つけることができます。私はあなたに具体的な例を与えることはできませんので、あなたのHTMLを示していないが、それはこのようなものになるだろう：

// your code... 
.click(function() { 
    var $input = $(this).closest('tr').find('input'); 
    console.log($input.val()); 
});