Javascript 如何使用API从多个IMDB ID获取电影信息？

我试着寻找这个问题，但我找不到任何适合我所面临问题的答案。 我最近开始玩JQuery，所以这一定很愚蠢

我有一个div（.movie），它在整个页面中重复出现，每个div都有一个特定的id（例如，泰坦尼克号）

标题、年份和运行时的信息来自函数中的JSONP。所以，在每个div中，我调用了这样的函数并定义了要搜索的电影

<div class="movie" id="tt0050083">
  <script>
    id = tt0050083;
    getinfo();
  </script>
  <p class="title"></p>
  <p class="year"></p>
  <p class="runtime"></p>
</div>

id=tt0050083；
getinfo（）；

问题是，它只将标题、年份和运行时附加到最后一个div，而不是全部。它获取不同电影的所有不同信息，但所有内容都附加到最后一个div

function getinfo(){
        $.ajax({
            url:"http://www.myapifilms.com/imdb?format=JSONP&idIMDB="+id,
            type:'GET',
            dataType:'JSONP',
            callback: 'callback',
            success: function(data, text, xhqr){
                $('#'+id).append( '<p class="title">' + data.title + '</p>' );
                $('#'+id).append( '<p class="year">' + data.year + '</p>' );
                $('#'+id).append( '<p class="runtime">' + data.runtime + '</p>' );
            }
        });
    }

函数getinfo（）{ $.ajax({ url:“http://www.myapifilms.com/imdb?format=JSONP&idIMDB=“+id， 类型：'GET'， 数据类型：'JSONP'， 回调：“回调”， 成功：功能（数据、文本、xhqr）{ $（'#'+id）.append（'

'+data.title+'

'）； $（'#'+id）.append（'

'+data.year+'

'）； $（'#'+id）.append（'

'+data.runtime+'

'）； } }); } 唯一有效的id被认为是我声明的最后一个id，尽管它在每次运行

getinfo（）

时搜索不同的电影，但它只是附加到错误的位置

我打赌这是愚蠢的，但我已经撞了我的头好几个小时了

---

谢谢

您正在向电影api发出多个请求。这些是异步请求，成功回调将在稍后执行（一旦api响应）。您的代码不会等待每个响应返回后再进行下一个响应。它继续并设置新的全局id并发出新请求。执行成功回调时，全局“id”变量被设置为对其进行的最后一次赋值。这就是为什么它们都被附加到最后一个div

function getinfo(){
        $.ajax({
            url:"http://www.myapifilms.com/imdb?format=JSONP&idIMDB="+id,
            type:'GET',
            dataType:'JSONP',
            callback: 'callback',
            success: function(data, text, xhqr){
                $('#'+id).append( '<p class="title">' + data.title + '</p>' );
                $('#'+id).append( '<p class="year">' + data.year + '</p>' );
                $('#'+id).append( '<p class="runtime">' + data.runtime + '</p>' );
            }
        });
    }

尝试将id传递到getInfo（）中，而不是设置全局变量

例如，调用getInfo（）的过程如下所示：

id = 123;
getInfo(id);

getInfo（）的定义如下所示：

function getInfo(id) { 
..... 
}

---

我认为手工制作div有点低效。最好通过imdb ID进行循环，并用正确的数据动态地创建div。这是我刚刚创建的一个示例脚本

var id=[“tt0068646”、“TT011161”、“tt0108052”]；
getMoviesByimdbID（id）；
函数getMoviesByimdbID（ar）{
var mymovies=$（“#moviecontainer”）；
对于（i=0；我认为成功函数是问题所在……如果你发布了json输出的一部分，那就更好了。你不需要在每个div中添加内联javascript。而是使用jQuery在成功回调中循环播放电影。如何做到这一点，我们不知道，因为你没有给出收到的json输出的示例。看起来类似于只请求并返回一个id。
数据。如果返回数组，则标题等将不起作用。您必须执行类似于
数据[0]的操作.title
。这比我要求的要好。谢谢，kasper。我注意到顺序是随机的，不一定是我为ID设置的顺序。有什么方法可以轻松地进行排序吗？再次感谢。这是因为脚本对每部电影都提出了异步请求。所以你不知道你的顺序是什么将接收电影。但是我可以修复它，我将调整我的答案。这是一个JSFIDLE，其中电影与阵列的顺序相同。但是它们将以（几乎）随机顺序出现。感谢您的解释，andew。对我来说完全有意义，并且工作得非常出色！