YT.Player有空值

幾個月前我發佈了一個關於this的問題，我的問題解決了。幾天前，我得到了報告，這個問題再次發生，我不確定爲什麼。YT.Player有空值

我想創建一個YT.Player對象，但失敗。當我console.log（）YT.Player對象，我沒有看到相關的預期功能，如cuePlaylist()或getDuration()。通過我的調試，我成功地提取了Youtube Video ID（我有console.log），並在創建YT.Player對象時將其作爲參數傳遞。我不明白爲什麼YT.Player會在我傳遞一個有效的YouTube ID時報告一個空視頻。此外，我已確保我的iframe附有YouTube視頻的ID。

onYouTubeIframeAPIReady = function() { 
    createPpdYoutubeObjects(); 
}; 

function createPpdYoutubeObjects() { 
    var delay = 5000; // need to wait for Youtube videos to load 
    setTimeout(function(){   
     // Sets up player tracker, and init the carousel 
     var players={}; 

     $('iframe.ytplayer').each(function() { 
      players[ grabYoutubeIdFromUrl($(this).attr('src')) ] = new YT.Player(grabYoutubeIdFromUrl($(this).attr('src')), { 
       events: { 
        'onReady': onReady, 
        'onStateChange': onStateChange 
       } 
      }); 

      console.log('id: ' + grabYoutubeIdFromUrl($(this).attr('src')));     
      console.log(players[ grabYoutubeIdFromUrl($(this).attr('src')) ]);     

     }); 
    }, delay); 
}; 

function grabYoutubeIdFromUrl(path) { 
    if (
     typeof path === "string" 
     && path.length > 0 
     && path.indexOf('embed/') > -1 
     && path.indexOf('?wmode', path.indexOf('embed/')) > -1 
    ) 
    { 
     var start = path.indexOf('embed/') + 6; 
     var end = path.indexOf('?wmode', start); 
     return path.substring(start, end); 
    } 
    return ""; 
}; 

<iframe id="eEIWYgA2lbQ" class="ytplayer" type="text/html" width="930" height="524" 
    src="https://www.youtube.com/embed/9VZUcLgtDM4?wmode=opaque&amp;rel=0&amp;enablejsapi=1&amp;iv_load_policy=3" 
    frameborder="0" allowfullscreen=""></iframe> 
<iframe id="L7oamJtBpdU" class="ytplayer" type="text/html" width="930" height="524" 
    src="https://www.youtube.com/embed/lF1j8mdmVEI?wmode=opaque&amp;rel=0&amp;enablejsapi=1&amp;iv_load_policy=3" 
    frameborder="0" allowfullscreen=""></iframe>

What I see in the YT.Player object

來源

2014-03-05 Jon

即使你5秒鐘時間沒有100％的保證，I幀將在DOM執行代碼前，試圖讀取他們的「SRC」屬性來創建的，尤其是考慮你沒有在你的問題中注意到你正在加載iFrame庫。如果您使用標記和src屬性來完成此操作，則最近的網絡條件可能會導致加載iframe庫，並且在DOM完全創建之前經過5秒。避免這種情況的最好方法是：

A）確保您的iframe在定義您的函數的腳本之前出現在頁面上。

B）不要加載內嵌框架庫，標籤和src屬性，而是做這樣的（只是定義你onYouTubeIframeAPIReady功能前）：如果你已經做了所有

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

並且它仍然不起作用，另一個嘗試是使用諸如jQuery的$ .document.ready（）函數之類的東西，並在其中加載iframe庫，以便在嘗試提取之前確保DOM完整來自您的iframe的src屬性。

希望這會引導你走向正確的方向;如果這些建議都不能提供幫助，也許你可以發佈你的整個頁面和腳本，並讓我們看得更徹底？

來源

2014-03-05 05:42:54 jlmcdonald

YT.Player有空值

回答

相關問題