如何加载json数组

时间:2017-07-25 16:26:34

标签: jquery ajax

我试图从api加载人员数据:www.swapi.co。 但是,我不知道如何加载电影标题 而不是他们的api地址。

$(function(){

var list = $('.list');
var submit = $('.submit-people');
var people = '1';

submit.on('click',function(){
    people++;
    list.empty();

    $.ajax({

        type: 'GET',
        url: 'https://swapi.co/api/people/' + people + '/',

        success: function(data) {

            list.append('<li>Name:' + data.name + '</li>');
            list.append('<li>Height:' + data.height + '</li>');
            list.append('<li>Mass:' + data.mass + '</li>');
            list.append('<li>Gender:' + data.gender + '</li>');
            list.append('<li>Movies:' + data.films + '</li>');

        }

    })

})

我目前的代码在这里:https://jsfiddle.net/wtpy71d7/2/

非常感谢任何帮助或建议

2 个答案:

答案 0 :(得分:1)

这可能会对你有所帮助。

success: function(data) {
     ...
     for(var i = 0; i< data.films.length; i++ )
          $.ajax({
             type: "get",
             url: data.films[i],

             success: function (data) {
                list.append('<li>Movies:' + data.title + '</li>');
             }
          });
     }
}

答案 1 :(得分:0)

看起来他们正在为您提供另一个API请求的网址。 您可以做的是进行另一个AJAX调用并获取每个电影的详细信息,然后解析这些结果并将它们附加到您的列表中。它可能看起来像这样。

list.append('<li>Movies:' + getMovies(data.films) + '</li>');

您的下一个ajax调用可能如下所示:

var getMovies = function(moviesAPI) {

$.ajax({
    type: 'GET',
    url: moviesAPI,
  success: function(data) {
  return data;
  }
})

}