我正在嘗試將我的資料放入 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>
該表再次顯示兩行,這是正確的,但行的每個值都表示未定義。
uj5u.com熱心網友回復:
您需要從記錄物件中提取欄位鍵:
$(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 變數,以便其余代碼可以使用該物件來獲取它們的值。
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/474345.html
標籤:javascript html api 拿来