Question

我目前正在开发一个使用Giphy API（https://github.com/Giphy/GiphyAPI）抓取随机GIF的简单网站。现在我只是练习，所以我正在尝试建立一个非常简单的骨骼网站。我的问题是我无法弄清楚如何使用jQuery正确获取数据。以下是我将API记录到控制台时的当前数据。我似乎无法抓住任何东西。我该如何获取这些数据？例如，如果我想要第一个结果的bitly_url，我的第一个本能将是数据[0] .bitly_url，但这不起作用。请帮忙！

这是我的HTML：

    <body>

<h1 class="animated infinte bounce"> GIFs-A-Go-Go </h1>
    <div class="info">
        <p> Is it GIF with a hard G? Or GIF with a soft G (Jif)? Whatever! Let's get some! </p>
            <form class="zipform">
                <input type="text" class="pure-input-rounded">
                <button type="submit" class="pure_button"> Search for GIFs </button>
                <input type="reset" value="Reset">
            </form>
            <div class="rando_facts animated bounceIn">
                <p id="here_is_gif"> </p>
            </div>
    </div>

我的jQuery / JS文件：

$('.pure_button').click(function(e) { 
e.preventDefault()
    console.log("click noticed")

$.ajax({


    url: "http://api.giphy.com/v1/gifs/search?q=" + $('.pure-input-rounded').val() +  "&api_key=dc6zaTOxFJmzC",
    type: "GET",
    success: function(data) {
        console.log("This works too")
        debugger
        console.log(data[0].bitly_url) // here is where I'm having an issue!


    }
});
});

*另外，我使用的Giphy API密钥是公钥。

Answer 1

尝试将其更改为此。 “data”是对象中的关键名称，并且两次使用它会让人感到困惑。

success: function(response) {
    //console.log("This works too")
    //debugger
    console.log(response.data[0].bitly_url);
}

Giphy API - 在我进行AJAX调用后，无法弄清楚如何调用数据

1 个答案: