如何獲取表單元格中的type輸入值？

Question

我有下表：

<tbody id="TableBodyId">
  <tr>
    <td>First Value</td>
    <td><input type="text" size="5" value="Second Value"></td>
  </tr>
</tbody>

我想知道如何使用JS或Jquery提取第first value和second value 。 以前，我的表如下所示：

<tbody id="TableBodyId">
  <tr>
    <td>First Value</td>
    <td>Second Value</td>
  </tr>
</tbody>

為了獲得值，我使用jQuery做到了：

var TableData = new Array();

$('#TableBodyId tr').each(function(row, tr)
{
    TableData[row] = {
        "firstValue" : $(tr).find('td:eq(0)').text(),
        "secondValue": $(tr).find('td:eq(1)').text()
    }
});

然后，我決定我希望能夠更改第二個單元格中的值，因此將其設置為：

<input type="text" size="5" value="Second Value"/>

現在的問題是，第二個單元格上的tableData是"" （換句話說，是空白）。 為了解決這個問題，我嘗試做：

"firstValue": $(tr).find('td:eq(0)').text(),
"secondValue": $(tr).find('td:eq(1)').val()

但是沒有運氣，Second Value仍然出現為"" 。 關於如何解決這個問題的任何想法？

Answer 1

您需要從<input>元素獲取值，如下所示：

TableData[row] = {
    "firstValue" : $(tr).find('td:eq(0)').text(),
    "secondValue": $(tr).find('td:eq(1) input').val()
}

例：

 $(document).ready(function() { var TableData = []; $('#TableBodyId tr').each(function(row, tr) { TableData[row] = { "firstValue" : $(tr).find('td:eq(0)').text(), "secondValue": $(tr).find('td:eq(1) input').val() } }); console.log(TableData); }); 

 .as-console {background-color:black !important; color:lime;} 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tbody id="TableBodyId"> <tr> <td>First Value</td> <td><input type="text" value="Second Value"></td> </tr> </tbody> </table> 

Answer 2

更改

"secondValue" :$(tr).find('td:eq(1)').val()

至

"secondValue" :$(tr).find('td input:eq(0)').val()