使用 getJSON 查询 json 显示 "undefined" 而不是数据

Question

我正在尝试将 getJSON 与 jQuery 一起使用，获取图像的 URL 并将其显示在此网页上。

API的URL有效（显示一个json），图像存在，但显示"undefined"。

有什么想法吗？

<script type = "text/javascript" language = "javascript">
  $(document).ready(function() {

    $("#driver").click(function(event){

      $.getJSON("https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos?earth_date=2015-6-3&api_key=API_KEY", {data: "value"}, function(json) { 
        $('#stage').html('<img src="' + json.photos.img_src + '">');
        $('#stage').append('<img src="' + json.photos.img_src + '">');
        $('#stage').append('<p> ID: ' + json.photos.id+ '</p>');
      })
    });
  });
</script>

Answer 1

因为它returns 是一个数组，而您没有引用数组中的元素

$(document).ready(function() {

    $("#driver").click(function(event){

      $.getJSON("https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos?earth_date=2015-6-3&api_key=cypvw52ysZT16N9HAFuh5bEDXb8lvDmw90ff4v26", {data: "value"}, function(json) { 
        //$('#stage').html('<img src="' + json.photos[0].img_src + '">');
        $('#stage').append('<img src="' + json.photos[0].img_src + '">');
        $('#stage').append('<p> ID: ' + json.photos[0].id+ '</p>');
      })
    });
  });



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="stage"></div>
<button id="driver">test</button>

使用 getJSON 查询 json 显示 "undefined" 而不是数据

Querying json using getJSON displays "undefined" instead of data

javascript

ajax

jquery

json

getjson