保持变量的值,同时使异步调用FB.api

问题描述:

我试图获得与下面的JavaScript功能的用户的相册,第一个电话获取专辑列表,而在专辑迭代我得到他们的封面图片:保持变量的值,同时使异步调用FB.api

function GetAlbums() { 
    FB.api('/me/albums', function(resp) { 
     var ul = document.getElementById('albums'); 
     for (var i=0, l=resp.data.length; i<l; i++) { 
      var album = resp.data[i]; 
      FB.api('/'+album.cover_photo, function(resp1) { 
       li = document.createElement('li'), 
       a = document.createElement('a'); 
       a.innerHTML = "<img src='"+resp1.picture+"'/>"+album.name; 
       a.href = album.link; 
       li.appendChild(a); 
       ul.appendChild(li); 
       }); 
     } 
    }); 
}; 

我不知道为什么,但封面图片取材良好,但专辑名称始终是相同的。可能内部的FB.api调用是异步的。在它完成之前,专辑迭代进入最后一个元素。我该如何纠正代码?

你的问题与Javascript关闭有关。

最里面的功能被触发N次,但GetAlbums完成后调用执行,而album变量等于最后一张专辑,在N个执行的。

速战速决将移动FB.api('/'+album.cover_photo...到一个单独的功能:

function getAlbum(album) { 
     FB.api('/'+album.cover_photo, function(resp1) { 
      li = document.createElement('li'), 
      a = document.createElement('a'); 
      a.innerHTML = "<img src='"+resp1.picture+"'/>"+album.name; 
      a.href = album.link; 
      li.appendChild(a); 
      ul.appendChild(li); 
      }); 
} 

function GetAlbums() { 
    FB.api('/me/albums', function(resp) { 
     var ul = document.getElementById('albums'); 
     for (var i=0, l=resp.data.length; i<l; i++) { 
      getAlbum(resp.data[i]); 
     } 
    }); 
}; 

的参数getAlbum现在可用于内部功能,并不会改变。