Javascript 使用ajax的Youtube Api多个视频

我一直在尝试使用YouTube Api显示多个视频，视频Id来自一个ajax调用。然而，我能得到的最好结果是它只加载了一个视频，而不是所有的视频

我在这里看到了一些类似的问题，这是因为API就绪函数只能运行一次。我已经尝试过将API就绪函数移到循环之外、ajax函数之外、为id创建数组等等。。。但我尝试过的任何其他东西，最终都一无所获

ajax调用中显示一个的代码是-

success: function(data) {
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

$.each(data, function(i, itemList) {
    var strList = "";
    for (i = 0; i < itemList.length; i += 1) {
        item = itemList[i];
        video = item[4];
        window.onYouTubeIframeAPIReady = function() {
            new YT.Player(i, {
                height: '250',
                width: '500',
                playerVars: {
                    'rel': 0,
                    'showinfo': 0,
                    'frameborder': 0,
                    'modestbranding': 1
                },
                videoId: video,
                events: {}
            });
        }
        strList += "<div id=" + i + "></div><br/>";
    }
    $("#random_list").html(strList);
});
}

成功：函数（数据）{
var tag=document.createElement（'script'）；
tag.src=”https://www.youtube.com/iframe_api";
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag）；
$.each（数据、函数（i、项目列表）{
var strList=“”；
对于（i=0；i”；
}
$（“#随机列表”）.html（strList）；
});
}

---

三个div创建得很好，但只有最后一个div被更改为iframe并显示视频。有人能看到我哪里出了问题，或者为我指出了正确的方向吗？

我通过将ajax成功更改为-

    success:function(data){
        var playerInfoList = [];
        $.each(data, function(i, itemList) {
            for (i = 0; i < itemList.length; i += 1) {
                item = itemList[i];
                playerNo = i + 1;
                playerInfoList.push({
                    id: 'player' + playerNo, 
                    videoId: item[4]
                });
            }   
        });
        loadVideos();
    }

成功：函数（数据）{
var PlayerFolist=[]；
$.each（数据、函数（i、项目列表）{
对于（i=0；i

它将视频细节推送到一个数组中，然后调用loadVideo函数，然后使用数组创建div和播放器-

function loadVideos() {
 var tag = document.createElement('script');
 tag.src = "https://www.youtube.com/iframe_api";
 var firstScriptTag = document.getElementsByTagName('script')[0];
 firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
 var strList = '';

 window.onYouTubeIframeAPIReady = function() {   

      if (typeof playerInfoList === 'undefined') return;
      for (var i = 0; i < playerInfoList.length; i++) {
       vidNo = i + 1;
       strList += "<div id='player" + vidNo + "'></div><br/>";
      }

      $("#video_list").html(strList);

      for (var i = 0; i < playerInfoList.length; i++) {
       var curplayer = createPlayer(playerInfoList[i]);
       players[i] = curplayer;
      }  
 }

 var players = new Array();

 function createPlayer(playerInfo) {
  return new YT.Player(playerInfo.id, {
   videoId: playerInfo.videoId,
  });
 }
}

函数加载视频（）{
var tag=document.createElement（'script'）；
tag.src=”https://www.youtube.com/iframe_api";
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag）；
var strList=''；
window.onyoutubeiframeapiredy=函数（）{
如果（playerFolist的类型=='undefined'）返回；
对于（变量i=0；i”；
}
$（“#视频列表”）.html（strList）；
对于（变量i=0；i

我将ajax成功更改为-

    success:function(data){
        var playerInfoList = [];
        $.each(data, function(i, itemList) {
            for (i = 0; i < itemList.length; i += 1) {
                item = itemList[i];
                playerNo = i + 1;
                playerInfoList.push({
                    id: 'player' + playerNo, 
                    videoId: item[4]
                });
            }   
        });
        loadVideos();
    }

成功：函数（数据）{
var PlayerFolist=[]；
$.each（数据、函数（i、项目列表）{
对于（i=0；i

它将视频细节推送到一个数组中，然后调用loadVideo函数，然后使用数组创建div和播放器-

function loadVideos() {
 var tag = document.createElement('script');
 tag.src = "https://www.youtube.com/iframe_api";
 var firstScriptTag = document.getElementsByTagName('script')[0];
 firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
 var strList = '';

 window.onYouTubeIframeAPIReady = function() {   

      if (typeof playerInfoList === 'undefined') return;
      for (var i = 0; i < playerInfoList.length; i++) {
       vidNo = i + 1;
       strList += "<div id='player" + vidNo + "'></div><br/>";
      }

      $("#video_list").html(strList);

      for (var i = 0; i < playerInfoList.length; i++) {
       var curplayer = createPlayer(playerInfoList[i]);
       players[i] = curplayer;
      }  
 }

 var players = new Array();

 function createPlayer(playerInfo) {
  return new YT.Player(playerInfo.id, {
   videoId: playerInfo.videoId,
  });
 }
}

函数加载视频（）{
var tag=document.createElement（'script'）；
tag.src=”https://www.youtube.com/iframe_api";
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag）；
var strList=''；
window.onyoutubeiframeapiredy=函数（）{
如果（playerFolist的类型=='undefined'）返回；
对于（变量i=0；i”；
}
$（“#视频列表”）.html（strList）；
对于（变量i=0；i

尝试用数据附加每个元素，而不是连接它。尝试用数据附加每个元素，而不是连接它。