我正試圖從biblia.api的api上提取ASV圣經的內容，并將資料填充到我的選擇下拉選單中，但是我做錯了，因為資料沒有填充到我的選擇下拉選單中。然而，我知道端點是正確的，它確實在我的控制臺中加載了帶有圣經內容的json物件。
$（document）.ready(function(){
let dropdown = document.getElementById('books') 。
dropdown.length = 0;
let defaultOption = document.createElement（'option'）。
defaultOption.text = 'Choose Book of the Bible'。
dropdown.add（defaultOption）。
dropdown.selectedIndex = 0;
const url = 'https://api.biblia.com/v1/bible/contents/ASV?key=aa43781d7b806b8d6764191dce895e10';
const request = new XMLHttpRequest()。
request.open('GET', url, true)。
request.onload = function（） {
if (request.status == 200) {
const books = JSON.parse（request.responseText）。
let option;
for (let i = 0; i < books.length; i ) {
option = document.createElement（'option'）。
option.text = books[i].passage;
option.value = books[i].passage;
dropdown.add(option)。
console.log（books[i].passage）。
}
} else {
//到達服務器，但它回傳一個錯誤。
}
}
request.onerror = function（）{
console.error('An error occurred fetching the JSON from ' url) 。
};
request.send()。
uj5u.com熱心網友回復：
你的問題是，你正在迭代 "responseText"，其中只包含一個名為books的專案。
為了實作你的目標，你應該在你的request.onload函式中使用類似的東西：
const data = JSON. parse（request.responseText）。
const books = data.books;
uj5u.com熱心網友回復：
考慮以下情況。
$(function(/span>) {
function loadSelect（target, url） {
var dropdown = $(target);
var defaultOption = $('<option> '). html("Choose Book of the Bible").appendTo（dropdown）。
$.getJSON(url, function(results) {
$.each(results.books，function(i, book) {
$("<option>", {
value: i
}).html(book.passage).appendTo（down）。
});
});
}
loadSelect("#books", "https://api.biblia.com/v1/bible/contents/ASV?key=aa43781d7b806b8d6764191dce895e10") 。
});
人們認為使用所有的JavaScript或jQuery是一個更好的做法，而不是混合使用它們。你可能喜歡使用$.getJSON()。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/321670.html
標籤：