我的 AJAX 调用没有检索任何数据，只是“未定义”

Question

我在调用 Mashape.com 上的随机电影报价生成器的 API 时可以正常工作。我最初的意图是构建一个可以生成圣经引用的应用程序。我正在使用这个市场页面https://market.mashape.com/acg/uncovered-treasure#random。我在控制台中没有收到任何错误，只是这样：

getNewQuote()
​
arguments: null
​
caller: null
​
length: 0
​
name: "getNewQuote"
​
prototype: Object { … }
​
__proto__: function ()
quote1.js:5:9
OPTIONSXHR
https://uncovered-treasure-v1.p.mashape.com/random
[HTTP/1.1 200 OK 170ms]
GETXHR
https://uncovered-treasure-v1.p.mashape.com/random
[HTTP/1.1 200 OK 178ms]
undefined
quote1.js:13:11
undefined

我不知道为什么我没有检索我在函数 displayQuote 中调用的数据（文本、上下文）。我究竟做错了什么？

jquery：

  $(document).ready(function() {
      //function to call a quote and bible verse
    function getNewQuote() {
        console.log(getNewQuote);
      $.ajax({
        type: "GET",
        url: "https://uncovered-treasure-v1.p.mashape.com/random",
        data: {},
        dataType: "json",
        success: function displayQuote(data) {
            //display the quote 
          $("#quote").html(data.text);
          console.log(data.text);
          //display the book the bible verse is being taken from 
          $("#author").html("-" + data.context);
          console.log(data.context);
          //commented the Tweet button out until I can get the quotes to work
          //   function tweetQuote() {
          //     var twitterURL =
          //       'https://twitter.com/intent/tweet?hashtags=quotes,freeCodeCamp&related=freecodecamp&text="';
          //     var quote = $("#quote").html();
          //     var author = $("#author").html();
          //     twitterURL += text + " " + context;
          //     $("#tweet").attr("href", twitterURL);
          //   }
        },
        //error message to display if the call does not work
        error: function() {
          prompt("Try again, God is on your side.");
        },
        //Mashape authorization and key
        beforeSend: function setHeader(xhr) {
          xhr.setRequestHeader(
            "X-Mashape-Key",
            "[API-KEY]"
          );
          xhr.setRequestHeader("Accept", "application/json");
        }
      });
    }
    //call a new quote each time the button is clicked
    $("#get-quote").on("click", getNewQuote());
    // console.log(getNewQuote);
  })

Answer 1

这是因为您尝试访问data.context，而API 以data.results 的格式返回。

results 是一个在每个索引上都有记录的数组，因此您需要将 ajax success 函数中的 data.context 和 data.text 语句替换为

data.results[0].context;

和

data.results[0].text;

分别

如果通过 API 返回多条记录，那么您需要像这样使用for in 循环

var results = data.results;

for (result in results) {
    console.log(data.results[result].context);
}