iframeコードをdocument.ready内に追加する際の問題点

Question

私の$（document）.ready（）関数の中にyoutube iframe apiコードを追加したいが、これを行うと、コードを外に移動すると、 document.readyプレーヤーは正常に読み込まれます。誰も私はどのように私はこのビデオが機能の中に表示されるようにするための任意の提案を提供することはできますか？それがロードされるとき

JS

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

    var player; 
    function onYouTubePlayerAPIReady() { 
     player = new YT.Player('player', { 
      height: '390', 
      width: '640', 
      videoId: 'u1zgFlCw8Aw', 
      events: { 
       'onReady': onPlayerReady, 
       'onStateChange': onPlayerStateChange 
      } 
     }); 
    } 

    function onPlayerReady() { 
     console.log('ready'); 
    } 

    function onPlayerStateChange() { 
     console.log('player changed'); 
    } 
}); 

Answer 1

あなたはwindow.onYouTubePlayerAPIReady = function() {...}にfunction onYouTubePlayerAPIReady() {...}を変更する場合、それは$(document).ready()関数内にYouTubeのiframeのAPIコールバックを定義し、潜在的にあなたのコールバックスコープに$(document).ready()範囲から他の変数にプルすることが可能です。

本当にやりたいことがあれば、それをするのにはメリットはありますが、それはオプションです。

Answer 2

スクリプトがonYouTubePlayerAPIReady()を呼び出します。あなたが...あなたのDOMレディラッパーの中でこれらの関数を「隠す」と言えば、YT APIが（スコープ外に）呼び出すためにはもう利用できません。

YT APIスクリプトファイルに直接アクセスできないため、この動作を変更することはできません。あなたが求めるものは不可能です。