表中顯示未定義的數據

Question

我正在嘗試將我的數據放入 HTML 表中。 JavaScript 正確檢測數據並在表中顯示兩行，這是正確的。 問題是兩行的每個字段都顯示未定義。 不知道從這里去哪里。

 $(function() { var records = []; $.getJSON('https://v1.nocodeapi.com/devmarq/airtable/RiBnzHulmTPHkgnD?tableName=JobListings&fields=company,logo,companyDescription,role,roleDescription,location,link,dateAdded&view=AllListings', function(data) { $.each(data.records, function parseJSON(i, f) { var tblRow = "<tr>" + "<td>" + f.company + "</td>" + "<td>" + f.companyDescription + "</td>" + "<td>" + f.role + "</td>" + "<td>" + f.roleDescription + "</td>" + "</tr>" $(tblRow).appendTo("#userdata tbody"); }); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <div class="wrapper"> <div class="profile"> <table id="userdata" border="2"> <thead> <th>Company</th> <th>Company Description</th> <th>Role</th> <th>Role Description</th> </thead> <tbody> </tbody> </table> </div> </div>

該表再次顯示兩行，這是正確的，但行的每個值都表示未定義。

Answer 1

您需要從記錄對象中提取字段鍵：

 $(function() { var records = []; $.getJSON('https://v1.nocodeapi.com/devmarq/airtable/RiBnzHulmTPHkgnD?tableName=JobListings&fields=company,logo,companyDescription,role,roleDescription,location,link,dateAdded&view=AllListings', function(data) { $.each(data.records, function parseJSON(i, { fields: f }) { var tblRow = "<tr>" + "<td>" + f.company + "</td>" + "<td>" + f.companyDescription + "</td>" + "<td>" + f.role + "</td>" + "<td>" + f.roleDescription + "</td>" + "</tr>" $(tblRow).appendTo("#userdata tbody"); }); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <div class="wrapper"> <div class="profile"> <table id="userdata" border="2"> <thead> <th>Company</th> <th>Company Description</th> <th>Role</th> <th>Role Description</th> </thead> <tbody> </tbody> </table> </div> </div>

我將parseJSON函數的第二個參數從f更改為{ fields: f } ; 這使用對象解構來獲取傳遞給第二個參數的對象中的字段條目的值，並將其分配給 f 變量，以便其余代碼可以使用該對象來獲取它們的值。