【问题标题】:How do I make an image provided by an api as the background image of my div in jQuery and node?如何将 api 提供的图像作为 jQuery 和节点中 div 的背景图像?
【发布时间】:2017-07-06 09:55:08
【问题描述】:

我正在尝试使用电影数据库 (tmdbs) 提供的 api 创建电影搜索引擎。我想为每部电影都有一个 div 弹出窗口,其标题类似于用户在数据库中键入的标题。现在我选择了电影《露西》作为我的实验。当我搜索 Lucy 作为我正在创建的 div 的背景图像时,我希望 api 的第一个结果中提供的海报图像,我似乎无法做到这一点。我的最终目标是使用 div 创建一系列结果,这些结果具有 api 中的前 20 个结果提供的背景图像。这是我的代码:

$('#search').keypress(function(e) {
        if (e.which == 13) {
            var movie = $('#search-input').val();
            $('form#login').submit();
            console.log('onclick fun', movie)
            makeCall(movie);
            return false;
        }
    });

    function makeCall(aMovie) {
        console.log('makecall', aMovie);

        link = url + aMovie;
        console.log(link);
        $.ajax({
            method: "GET",
            url: link,
            success: function(data) {
                console.log("the data -->", data);
                getData(data);
            },
        })
    }

    function getData(responseData) {
        var poster = responseData.results[0].poster_path;
        appendToDom(poster);
    }

    function appendToDom(poster) {
        var aPoster = $('<div>');
        var movie_poster = 'https://image.tmdb.org/t/p/w1280' + poster;
        console.log(movie_poster);
        aPoster.css({
            'float': 'left',
            'margin': 10,
            'margin-left': 37,
            'margin-top': 20,
            'width': 200,
            'height': 300,
            'font-size': 36,
            'color': 'black',
            'background-size': '200px 300px',
            'background-image': 'https://image.tmdb.org/t/p/w1280/rwn876MeqienhOVSSjtUPnwxn0Z.jpg' //'url("./../images/question.jpg")'
        })
        $(main).append(aPoster);
    }

这是我要查找的内容的屏幕截图。我希望出现的不是问号,而是电影海报。

enter image description here

我真的很抱歉发了这么长的帖子。我希望有人可以帮助我:)

提前非常感谢!

【问题讨论】:

  • 'background-image': 'url(your url goes here)'

标签: javascript jquery html css node.js


【解决方案1】:

var aPoster = $('');

var aPoster = $('div');

返回完全不同的值。可能想检查一下。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-07-01
    • 2010-12-16
    • 2021-02-01
    相关资源
    最近更新 更多