在点击弹出窗口显示错误的数据

问题描述:

我正在做一个电影计划页为我所用,但我面临的一个问题。 我想使页面弹出的电影,我点击的信息,但它总是显示在过去的电影列表中的信息。在点击弹出窗口显示错误的数据

我敢肯定,这是简单的东西,但我没有看到它。

我用得到我需要的信息代码:

var settings = { 
 
    "async": true, 
 
    "crossDomain": true, 
 
    "url": ("https://api.themoviedb.org/3/search/movie?api_key=e8a6a870421f5cc13e775873bfe1cad8&language=bg&query=")+encodeURIComponent(fn), 
 
    "method": "GET", 
 
    "headers": {}, 
 
    "data": "{}" 
 
} 
 
$.ajax(settings).done(function (response) { 
 
    var plakat = response.results[0].poster_path; 
 
    window.movieId = response.results[0].id; 
 
    window.title = response.results[0].title; 
 
    window.poster = "https://image.tmdb.org/t/p/w92/"+plakat; 
 
    window.overview = response.results[0].overview; 
 
    console.log(response.results[0].title); 
 
    var k; 
 
    for(k=0; k< ttest.length; k++){ 
 
    document.getElementById('myPopup').innerHTML = ("<img align='left' src="+window.poster+"><h2>"+window.title+"</h2><br>"+window.overview); 
 
    } 
 
});

那么我想循环中的所有结果,这样我就可以改变在弹出窗口中显示的数据,但它不似乎没有用。

任何帮助将不胜感激。

+0

你能产生这个最小的版本?这是一个很多为这样一个简单的问题 –

+5

涉水通过好像你对于发送您的列表中的每个条目一个Ajax请求,当他们回答,你覆盖你弹出的内容。所以你的弹出包含了最后解决的ajax请求的结果。而所有其他请求只是浪费时间和带宽。 – Thomas

+0

希望这是更好看。 –

这将显示每个电影的缩略图图像。当您单击缩略图,标题和描述(如果可用)将出现:

JS

var fn = "snow white"; 
var settings = { 
"async": true, 
"crossDomain": true, 
"url": ("https://api.themoviedb.org/3/search/movie?api_key=e8a6a870421f5cc13e775873bfe1cad8&language=bg&query=")+encodeURIComponent(fn), 
"method": "GET", 
"headers": {}, 
"data": "{}" 
} 

$.ajax(settings).done(function (response) { 

for(var i = 0; i < response.results.length; i++) { 
    var obj = response.results[i]; 

    var plakat = obj.poster_path; 
    var movieId = obj.id; 

    var title = obj.title.replace(/'/g, "&#39;"); 
    var title = title.replace(/"/g, '\\"'); 

    if (plakat !== null) { 
    var poster = "https://image.tmdb.org/t/p/w92/"+plakat; 
    } else { 
    var poster = ""; 
    } 

    var overview = obj.overview.replace(/'/g, "&#39;"); 
    var overview = overview.replace(/"/g, '\\"'); 

    $("#movieList").append("<a href='javascript:showInfo("+'"'+title+'"'+","+'"'+overview+'"'+");'><img src='"+poster+"' height='102' width='82' style='padding:5px;'></a>"); 

} 
}); 


function showInfo(title,overview){ 
    document.getElementById('myPopup').innerHTML = "<b>"+title+"</b>"+" <br>"+overview; 
} 

HTML

<div id="movieList" align="left"></div> 
<div id="myPopup"></div>