0

我正在尝试学习一些前端工程，但我正在关注应该是一件容易做的事情。我检查了其他问题，并尝试了嵌套$each推荐

我编写了一个简单的 REST API，它在页面加载时返回此 JSON：

{"book":    
[{"authorFirstName":"Clive","authorLastName":"Cussler","genre":"Fiction","title":"Inca    
Gold"},{"authorFirstName":"Og","authorLastName":"Mandino","genre":"Self
Improvement","title":"The Greatest Salesman in the World"}, 
{"authorFirstName":"Bill","authorLastName":"O'Reilly","genre":"History","title":"Killing 
Lincoln"}]}

问题不在于从服务器获取此信息；当页面加载或转到 REST URL 时，我会收到此信息。我在渲染页面时遇到了麻烦。这是我的 AJAX 调用和成功函数：

function getAllBooks() {
    console.log("Getting all books");
        $.ajax({
            type: 'GET',
            url: rootURL, 
            dataType: "json",
            success: renderBookList
        });
}

function renderBookList(data) {
    $('#bookList li').remove();
    $.each(data, function(index, book) {
        $('#bookList').append('<li><a href="#">' + book.title + '</a></li>');
    });
}

如果我将$each函数内的行更改为book[0].title，那么我会在 JSON 中获得第一本书的标题。

我错过了什么？JSON的问题是它是一个具有一个属性的对象（但该属性是一个对象数组）？

服务器是 JAX-RS 并返回一个ArrayList<Book>如果那是密切相关的。谢谢你的帮助。

4

1 回答 1

4

bookJSON 响应中的属性引用了您的 book 数组。

function renderBookList(data) {
    $('#bookList li').remove();
    $.each(data.book, function(index, book) {
        $('#bookList').append('<li><a href="#">'+ book.title +'</a></li>');
    });
}

注意：您应该缓存$('#bookList')在一个变量中，而不是在每次迭代中检索它。

于 2013-04-07T23:26:05.077 回答