首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Giphy API -如何显示搜索结果中的图像?

Giphy API -如何显示搜索结果中的图像?
EN

Stack Overflow用户
提问于 2017-01-13 00:28:39
回答 0查看 2.3K关注 0票数 0

指向Giphy API的GitHub链接在这里:https://github.com/Giphy/GiphyAPI

我的问题:由于我是新人,我现在有点卡住了。我从giphy API得到的是随机的gif,而不是用户想要的特定搜索结果。

如何获得用户想要的具体搜索结果,而不是随机的gif?

HTML

代码语言:javascript
复制
<h1> Let's Search Some Gifs! </h1>
<div class="info">
    <p> Search below to the wonderful world of Gifs! </p>
        <form class="gif-form">
            <input type="text" id="form-value" class="search-input-rounded">
            <button type="submit" class="search_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>

JS

代码语言:javascript
复制
document.addEventListener('DOMContentLoaded', function () {

q = "+=";

request = new XMLHttpRequest;
request.open('GET', 'http://api.giphy.com/v1/gifs/random?api_key=dc6zaTOxFJmzC&tag='+q, true);

request.onload = function() {
    if (request.status >= 200 && request.status < 400){
        data = JSON.parse(request.responseText).data.image_url;
        console.log(data);
        document.getElementById("here_is_gif").innerHTML = '<center><img src = "'+data+'"  title="GIF via Giphy"></center>';
    } else {
        console.log('reached giphy, but API returned an error');
     }
};

request.onerror = function() {
    console.log('connection error');
};

request.send();
});
EN

回答

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41618292

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档