1

次の動的HTML 行があります。

<tr role="row" class="odd">
     <td contenteditable="false" class="sorting_1"> </td>
     <td contenteditable="false"> <span class="name">Alex Nilson </span></td>
     <td contenteditable="false"><span class="price"> 1234 </span></td>
     <td contenteditable="false"> <span class="qty" >1234 </span></td>
     <td><button class="pr_edit" href="javascript:;"> Edit </button></td>
     <td><button class="pr_elete" href="javascript:;"> Delete </button></td>
</tr>

編集ボタンをクリックすると、その特定の行のセル要素の値を JS 変数として jQuery に取得する必要があります。これを AJAX POST で別の PHP ページに送信して、データベースに挿入できます。以下のようにしてみましたが、うまくいきませんでした。

$(document).ready(function () {
     $('.pr_edit').click(function () {
         var currentTD = $(this).parents('tr').find('td');            
         $.each(currentTD, function () {
             var iname = $(this).find("span.name").html();
             var iprice = $(this).find("span.price").val();
             var iqty=$(this).find("span.qty").val();
         });

意図したとおりに変数をキャッチしません。どうすればこれを達成できますか? これらの SPAN データを 3 つの変数に取得する必要があります。

4

2 に答える 2

6

動的に生成された要素のイベント委任が必要であり、のコンテンツを取得するtext()代わりに使用します。親を取得するためにも使用します。それぞれを使用する必要はありません。val()spanclosest('tr')tr

$(document).ready(function () {
     $('body').on('click', '.pr_edit', function () {
         var currentTR = $(this).closest('tr');
         var iname = currentTR.find("span.name").text();
         var iprice = currentTR.find("span.price").text();
         var iqty = currentTR.find("span.qty").text();
     });
 });
于 2016-02-01T13:18:56.270 に答える