Youtube API：没有方法"loadVideoById"？

Question

我的HTML

<div id="player">
        <!-- hardcoded for the moment -->
        <div id="video">
            <iframe class="youtube-player" id="video-frame" width="640" height="390" src="http://www.youtube.com/v/gSy4HeDjPvs?version=2&enablejsapi=1" frameborder="0" allowfullscreen></iframe>
        </div>
    </div>

JavaScript

var youtube_player; // global player variable
// adding YouTube controls
$(function () {
    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/iframe_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
});
function onYouTubeIframeAPIReady() {
    //noinspection JSUnresolvedFunction,JSUnresolvedVariable
    youtube_player = new YT.Player('video', {
        height:'390',
        width:'640',
        videoId:'JW5meKfy3fY',
        events:{
            'onReady':onPlayerReady,
            'onStateChange':onPlayerStateChange
        }
    });
}
// playing video in left pane
function play_video(id) {
    console.log('play video', id);
    //noinspection JSUnresolvedFunction
    if (youtube_player) {
      youtube_player.loadVideoById(id, 0);
    }
}
function onPlayerReady(evt) {
  evt.target.playVideo();
}
// when video is finished playing, what next video to play?
function onPlayerStateChange(event) {
    if (event.data == 0) {
        var id = get_next_video_id();
        if (id == -1) {
            // repeat = 0, reset video_index
            reset_video_index();
        } else {
            play_video(id);
        }
    }
}

这在Safari中运行良好，但在Chrome中失败。console.log上显示

Uncaught TypeError: Object #<U> has no method 'loadVideoById' vlists.js:447
30
Unable to post message to http://www.youtube.com. Recipient has origin https://www.youtube.com.

即使在YouTube API中，loadVideoById仍然存在。

Answer 1

通过YouTube API工作一段时间后，我能够使其同时运行Chrome和Safari

演示是http://plnkr.co/edit/07Cq5KqIa5Pase8JYHbA?p=preview