javascript - JQuery每次获取表行中多个表数据的值

Question

您好，我有这个包含多行的表。 我想知道如何获取该表每一行中的某些数据。在此表中，我需要获取学号数据及其随附的成绩。

<tbody>
   <?php foreach ($class_list_view as $student) { ?>
   <tr>
      <td class="studentnumber"><?= $student->studentnumber ?></td>
      <td><?= $student->lastname ?></td>
      <td><?= $student->firstname ?></td>
      <td><?= $student->middlename ?></td>
      <td><?= $student->level ?></td>
      <td><?= $student->year ?></td>
      <td>
         <select class="custom-select grade" style="height: 20px;">
            <option selected value="">Select Grade</option>
            <option value="passed">Passed</option>
            <option value="failed">Failed</option>
         </select>
      </td>
   </tr>
   <?php } ?>
</tbody>

我尝试过在 jquery 中使用 each 循环，但我不知道如何使用它获得相似/内联选择器。

 $("table tbody tr td.studentnumber").each(function (index) {
        studentnum_array.push( {"studentnumber": $(this).text(), "grade": $('table tbody tr td select.grade').val() } );
    });

     console.log( studentnum_array );

但是在grade索引中它只取第一个。它应该接受每行中 select 的值，类似于 td studentnumber。

Answer 1

您可以循环遍历行而不是单元格...

var studentnum_array = [];

$("table tbody tr").each(function(index) {
    studentnum_array.push({ 
        "studentnumber": $(this).find('td.studentnumber').text(),
        "grade": $(this).find('select.grade').val()
    });
});

console.log(studentnum_array);

如果您想循环遍历单元格，则必须找到与相应studentnumber单元格相关的select...

var studentnum_array = [];

$("table tbody td.studentnumber").each(function(index) {
    studentnum_array.push({ 
        "studentnumber": $(this).text(),
        "grade": $(this).closest('tr').find('select.grade').val()
    });
});

console.log(studentnum_array);